[转载]asp.net基于jquery的ajax二级联动

[转载]asp.net基于jquery的ajax二级联动.
页面代码:

index.aspx
 
<script src="../ADMIN/js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
 
//预先加载第一个select,加载品牌,看好加载的的页面BrandHandler.ashx
 
        $.post('BrandHandler.ashx', {}, function(data) { $("#carbrand").html(data) }, 'html');
 
//当选择品牌的时候加载二级车系,构成联动
        $("#carbrand").change(function() {
        $.post('TypeHandler.ashx', { cartype: $(this).val() }, function(data) { $("#cartype").empty().html(data) }, 'html');
        });
    });
</script>
<table  width="950" height="35" border="0" cellpadding="0" cellspacing="0" class="left_tb">
  <tr>
    <td width="70" align="right" background="../IMAGES/b_4.gif"><img src="../IMAGES/serch_so.gif" width="59" height="17" /></td>
    <td width="100" background="../IMAGES/b_4.gif">
        <select id="carbrand" name="carbrand" >
            <option value="-1">--选择品牌--</option>
        </select>
        </td>
    <td width="105" background="../IMAGES/b_4.gif">
        <select id="cartype" name="cartype" >
            <option value="-1">--选择车系--</option>
        </select>
        </td>
    <td background="../IMAGES/b_4.gif" style="width:80px">
        &nbsp;
       <a href="###" id="search_type"><img  src="../IMAGES/serch.gif" alt="搜索" style="border:0px"/></a>
       </td>
    <td width="120" background="../IMAGES/b_4.gif">
        <input id="TextKeys" type="text"   />
        </td>
    <td width="100" align="left" background="../IMAGES/b_4.gif">
   <a href="###" id="search_news"> <img alt="新闻资讯" src="../IMAGES/serch.gif"  style="border:0"/></a>
    </td>
  </tr>
</table>

Hanlder异步处理页面代码:

using System;  
using System.Web;  
using System.Data;  
using System.Text;  
using System.Data.SqlClient;  
using Tools;  
public class BrandHandler : IHttpHandler {  
        
    public void ProcessRequest (HttpContext context) {  
        context.Response.ContentType = "text/plain";  
        string ssql = "select * from D_CARS_BRAND_TYPE where CARS_BRAND_TYPE>=-1 order by ORDER_NO asc";  
        SqlDataReader dr = (SqlDataReader)DataBase.GetDataReader(ssql);  
        StringBuilder st = new StringBuilder();  
        while(dr.Read())  
        {  
            st.Append("<option value=\"" + dr&#91;"CARS_BRAND_TYPE"&#93;.ToString() + "\">" + dr["CARS_BRAND_TYPE_NAME"].ToString() + "</option>\n");  
        }  
        dr.Close();  
        context.Response.Write(st.ToString());  
    }  
     
    public bool IsReusable {  
        get {  
            return false;  
        }  
    }  
}
 
using System;  
using System.Web;  
using System.Data;  
using System.Text;  
using System.Data.SqlClient;  
using Tools;  
public class TypeHandler : IHttpHandler  
{  
    public void ProcessRequest(HttpContext context)  
    {  
        context.Response.ContentType = "text/plain";  
        context.Response.Clear();  
        int cartype = 0;  
        if (int.TryParse(context.Request.Form["cartype"].ToString(), out cartype))  
        {  
            string ssql = "select * from D_CARS_TYPE where CARS_BRAND_TYPE=" + cartype + " order by ORDER_NO asc";  
            SqlDataReader dr = (SqlDataReader)DataBase.GetDataReader(ssql);  
            StringBuilder st = new StringBuilder();  
            while (dr.Read())  
            {  
                st.Append("<option value=\"" + dr&#91;"CARS_TYPE"&#93;.ToString() + "\">" + dr["CARS_TYPE_NAME"].ToString() + "</option>\n");  
            }  
            dr.Close();  
            context.Response.Write(st.ToString());  
        }  
        else 
            context.Response.Write("<option value='1'>--出现错误--</option>");  
    }  
    public bool IsReusable  
    {  
        get 
        {  
            return false;  
        }  
    }  
  
赞(0) 打赏
分享到: 更多 (0)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏