1.HTML页面
<
td
align
="left"
>
< asp:DropDownList ID ="ddlOne" runat ="server" >
</ asp:DropDownList >
< asp:DropDownList ID ="ddlTwo" runat ="server" >
</ asp:DropDownList >
</ td >
< asp:DropDownList ID ="ddlOne" runat ="server" >
</ asp:DropDownList >
< asp:DropDownList ID ="ddlTwo" runat ="server" >
</ asp:DropDownList >
</ td >
ddlOne的绑定这里就不说了,后台直接绑定即可,关键是选择ddlOne的时候页面无刷新的级联ddlTwo。
首先添加ddlOne的选择事件
this
.ddlOne.Attributes.Add(
"
OnChange
"
,
"
BindDropDownList()
"
);
2.BindeDropDownList()方法读取ashx,以获取父类ID等于ddlOne选中值的集合,这里我们用JOSN方式获取
JS
function
BindDropDownList() {
var one = $( " #ddlOne " ).val();
$( " #ddlTwo " ).html( "" );
$.getJSON( " ../Customer/Area.ashx?parentid= " + one, null , function (json) {
$.each(json, function (i) { $( " #ddlTwo " ).append($( " <option></option> " ).val(json[i].areacode).html(json[i].areaname)) });
});
$( " <option></option> " ).val( " -1 " ).html( " ---请选择城市--- " ).appendTo( " #ddlTwo " );
}
var one = $( " #ddlOne " ).val();
$( " #ddlTwo " ).html( "" );
$.getJSON( " ../Customer/Area.ashx?parentid= " + one, null , function (json) {
$.each(json, function (i) { $( " #ddlTwo " ).append($( " <option></option> " ).val(json[i].areacode).html(json[i].areaname)) });
});
$( " <option></option> " ).val( " -1 " ).html( " ---请选择城市--- " ).appendTo( " #ddlTwo " );
}
2.area.ashx
ashx
public
void
ProcessRequest(HttpContext context)
{
StringBuilder sb = new StringBuilder();
string strparent = context.Request.QueryString[ " parentid " ].ToString();
string strwhere = " areacode like ' " + strparent.Substring( 0 , 2 ) + " %' and areacode not like '%0000' " ; // 取得子类
DataTable dt = new BLL.SF_Host_AreaInfo().GetList(strwhere).Tables[ 0 ];
if (dt == null || dt.Rows.Count == 0 )
{
return ;
}
else
{
sb.Append( " [ " );
for ( int i = 0 ; i < dt.Rows.Count; i ++ )
{
// 返回JOSN数据
sb.Append( " {\"areacode\":\" " + dt.Rows[i][ " areacode " ].ToString() + " \",\"areaname\":\" " + dt.Rows[i][ " areaname " ].ToString() + " \"}, " );
}
sb.Remove(sb.Length - 1 , 1 );
sb.Append( " ] " );
}
context.Response.ContentType = " application/json " ;
context.Response.ContentEncoding = Encoding.UTF8;
context.Response.Write(sb.ToString());
}
{
StringBuilder sb = new StringBuilder();
string strparent = context.Request.QueryString[ " parentid " ].ToString();
string strwhere = " areacode like ' " + strparent.Substring( 0 , 2 ) + " %' and areacode not like '%0000' " ; // 取得子类
DataTable dt = new BLL.SF_Host_AreaInfo().GetList(strwhere).Tables[ 0 ];
if (dt == null || dt.Rows.Count == 0 )
{
return ;
}
else
{
sb.Append( " [ " );
for ( int i = 0 ; i < dt.Rows.Count; i ++ )
{
// 返回JOSN数据
sb.Append( " {\"areacode\":\" " + dt.Rows[i][ " areacode " ].ToString() + " \",\"areaname\":\" " + dt.Rows[i][ " areaname " ].ToString() + " \"}, " );
}
sb.Remove(sb.Length - 1 , 1 );
sb.Append( " ] " );
}
context.Response.ContentType = " application/json " ;
context.Response.ContentEncoding = Encoding.UTF8;
context.Response.Write(sb.ToString());
}