`
黄继华
  • 浏览: 42961 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

ajax(1)

 
阅读更多
我的截图如下:
o_Ajax两级DropDownList联动.JPG
1.首先要在项目中增加对ajax.dll的引用. 2.AjaxMethod.cs
AjaxMethod.cs
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->usingSystem;
usingSystem.Data;
usingSystem.Data.SqlClient;
namespaceMyAjaxSample
{
/**////<summary>
///AjaxMethod的摘要说明。
///</summary>

publicclassAjaxMethod
{

GetPovinceList#regionGetPovinceList
publicstaticDataSetGetPovinceList()
{
stringsql="select*frompovince";
returnGetDataSet(sql);
}

#endregion


GetCityList#regionGetCityList
[Ajax.AjaxMethod]
publicDataSetGetCityList(intpovinceid)
{
stringsql="select*fromcitywherefather='"+povinceid+"'";
returnGetDataSet(sql);
}

#endregion


GetAreaList#regionGetAreaList
[Ajax.AjaxMethod]
publicDataSetGetAreaList(intcityid)
{
stringsql="select*fromareawherefather='"+cityid+"'";
returnGetDataSet(sql);
}

#endregion


GetDataSet#regionGetDataSet
publicstaticDataSetGetDataSet(stringsql)
{
stringConnectionString=System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
SqlDataAdaptersda
=newSqlDataAdapter(sql,ConnectionString);
DataSetds
=newDataSet();
sda.Fill(ds);
returnds;
}

#endregion




}

}


3.HTML代码:
FourAjaxSample.aspx
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--><%@Pagelanguage="c#"Codebehind="FourAjaxSample.aspx.cs"AutoEventWireup="false"Inherits="MyAjaxSample.FourAjaxSample"%>
<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.0Transitional//EN">
<HTML>
<HEAD>
<title>FourAjaxSample</title>
<metacontent="MicrosoftVisualStudio.NET7.1"name="GENERATOR">
<metacontent="C#"name="CODE_LANGUAGE">
<metacontent="JavaScript"name="vs_defaultClientScript">
<metacontent="http://schemas.microsoft.com/intellisense/ie5"name="vs_targetSchema">
<scriptlanguage="javascript">
functioncityResult()
{
varcity=document.getElementById("DropDownList1");
AjaxMethod.GetCityList(city.value,get_city_Result_CallBack);
}


functionget_city_Result_CallBack(response)
{
if(response.value!=null)
{
document.all(
"DropDownList2").length=0;    
    
vards=response.value;
if(ds!=null&&typeof(ds)=="object"&&ds.Tables!=null)
{
for(vari=0;i<ds.Tables[0].Rows.length;i++)
    
{
    
varname=ds.Tables[0].Rows[i].city;
      
varid=ds.Tables[0].Rows[i].cityID;
      document.all(
"DropDownList2").options.add(newOption(name,id));
    }

    document.all(
"TextBox1").value="";  
}

}

return
}


functionareaResult()
{
vararea=document.getElementById("DropDownList2");
AjaxMethod.GetAreaList(area.value,get_area_Result_CallBack);
}



functionget_area_Result_CallBack()
{
    
varprovince=document.getElementById("DropDownList1");
varpindex=province.selectedIndex;
varpValue=province.options[pindex].value;
varpText=province.options[pindex].text;

varcity=document.getElementById("DropDownList2");
varcindex=city.selectedIndex;
varcValue=city.options[cindex].value;
varcText=city.options[cindex].text;
    document.all(
"TextBox1").value=pText+cText;    

}

</script>
</HEAD>
<bodyMS_POSITIONING="GridLayout">
<formid="Form1"method="post"runat="server">
<h3>Ajax实现两级联动</h3>
<TABLEclass="border"id="border"style="Z-INDEX:101;LEFT:16px;WIDTH:289px;POSITION:absolute;TOP:48px;HEIGHT:79px"
borderColor
="#95b0d9"cellSpacing="0"cellPadding="0"width="289"align="center"bgColor="#ffffff"
border
="1">
<TR>
<TDstyle="WIDTH:130px;HEIGHT:27px"bgColor="#d8e7f6">
<asp:labelid="Lab_province"runat="server">省(直辖市)</asp:label></TD>
<TDstyle="HEIGHT:27px">
<asp:dropdownlistid="DropDownList1"runat="server"onchange="cityResult();"></asp:dropdownlist></TD>
</TR>
<TR>
<TDstyle="WIDTH:130px;HEIGHT:24px"bgColor="#d8e7f6">
<asp:Labelid="Lab_City"runat="server">城市</asp:Label></TD>
<TDstyle="HEIGHT:24px">
<asp:DropDownListid="DropDownList2"runat="server"onchange="areaResult();"></asp:DropDownList></TD>
</TR>
<TR>
<TDstyle="WIDTH:130px"bgColor="#d8e7f6">你的最后选择是:
</TD>
<TD>
<asp:TextBoxid="TextBox1"runat="server"></asp:TextBox></TD>
</TR>
</TABLE>
</form>
</body>
</HTML>

4 .cs文件:
FourAjaxSample.aspx.cs
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->usingSystem;
usingSystem.Collections;
usingSystem.ComponentModel;
usingSystem.Data;
usingSystem.Drawing;
usingSystem.Web;
usingSystem.Web.SessionState;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
usingSystem.Web.UI.HtmlControls;

namespaceMyAjaxSample
{
/**////<summary>
///FourAjaxSample的摘要说明。
///</summary>

publicclassFourAjaxSample:System.Web.UI.Page
{
protectedSystem.Web.UI.WebControls.DropDownListDropDownList1;
protectedSystem.Web.UI.WebControls.LabelLab_province;
protectedSystem.Web.UI.WebControls.LabelLab_City;
protectedSystem.Web.UI.WebControls.TextBoxTextBox1;
protectedSystem.Web.UI.WebControls.DropDownListDropDownList2;

privatevoidPage_Load(objectsender,System.EventArgse)
{
Ajax.Utility.RegisterTypeForAjax(
typeof(MyAjaxSample.AjaxMethod));
if(!Page.IsPostBack)
{
this.DropDownList1.DataSource=AjaxMethod.GetPovinceList();
this.DropDownList1.DataTextField="province";
this.DropDownList1.DataValueField="provinceID";
this.DropDownList1.DataBind();
this.DropDownList1.Attributes.Add("onclick","cityResult();");
this.DropDownList2.Attributes.Add("onclick","areaResult();");
}

}


Web窗体设计器生成的代码#regionWeb窗体设计器生成的代码
overrideprotectedvoidOnInit(EventArgse)
{
//
//CODEGEN:该调用是ASP.NETWeb窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}


/**////<summary>
///设计器支持所需的方法-不要使用代码编辑器修改
///此方法的内容。
///</summary>

privatevoidInitializeComponent()
{
this.Load+=newSystem.EventHandler(this.Page_Load);

}

#endregion

}

}


5.web.config
web.config设置数据库连接串
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--><appSettings>
<!--SQL数据库连接-->
<addkey="ConnectionString"value="DataSource=localhost;UserId=sa;Password=zhangzs;InitialCatalog=mytest;"/>
</appSettings>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics