asp.net基於jquery的ajax二級聯動

index.aspx

 

<mce:script src="../ADMIN/js/jquery.js" mce_src="ADMIN/js/jquery.js" type="text/javascript"></mce:script> <mce: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'); }); }); // --></mce: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" mce_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">   <a href="###" mce_href="###" id="search_type"><img src="../IMAGES/serch.gif" mce_src="IMAGES/serch.gif" alt="搜索" style="border:0px" mce_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="###" mce_href="###" id="search_news"> <img alt="新聞資訊" src="../IMAGES/serch.gif" mce_src="IMAGES/serch.gif" style="border:0" mce_style="border:0"/></a> </td> </tr> </table> 本文來自CSDN博客，轉載請標明出處：http://blog.csdn.net/wangjun8868/archive/2008/09/26/2983149.aspx

 

BrandHandler.ashx

<%@ WebHandler Language="C#" Class="BrandHandler" %> 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["CARS_BRAND_TYPE"].ToString() + "/">" + dr["CARS_BRAND_TYPE_NAME"].ToString() + "</option>/n"); } dr.Close(); context.Response.Write(st.ToString()); } public bool IsReusable { get { return false; } } }

TypeHandler.ashx

<%@ WebHandler Language="C#" Class="TypeHandler" %> 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["CARS_TYPE"].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; } } }