DropDownList无刷新级联下拉(固定级联),Jquery获取JOSN数据

本文详细介绍了如何在ASP.NET页面中实现一个带级联功能的下拉列表,包括绑定事件、AJAX调用及数据解析过程。

1.HTML页面

 

<td align="left">
                                
<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方式获取

 

ExpandedBlockStart.gifJS
function BindDropDownList() {
    
var one = $("#ddlOne").val();
    $(
"#ddlTwo").html("");
    $.getJSON(
"../Customer/Area.ashx?parentid=" + one, nullfunction(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

ExpandedBlockStart.gifashx
public void ProcessRequest(HttpContext context)
        {
            StringBuilder sb 
= new StringBuilder();
            
string strparent = context.Request.QueryString["parentid"].ToString();
            
string strwhere = " areacode like '" + strparent.Substring(02+ "%' 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 
- 11);
                sb.Append(
"]");
            }
            context.Response.ContentType 
= "application/json";
            context.Response.ContentEncoding 
= Encoding.UTF8;
            context.Response.Write(sb.ToString());
        }

 

 

转载于:https://www.cnblogs.com/yinpeng186/archive/2011/07/28/2119388.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值