學習新事物：使用jquery+xml實現ajax簡單一實例

調用頁面通過事件觸發

<asp:dropdownlist id="ddlAgentCity" runat="server" onchange="OnAgentCityChange();"></asp:dropdownlist>

對應函數，使用ajax的方式調用上面頁面得到資料集，並差找出對應記錄

 

1. function OnAgentCityChange()
2. {
3.     var city = $("#<%=ddlAgentCity.ClientID%>").val();
4.     $.ajax(
5.     {
6.         url: '<%=PageUtility.GetRootURL()%>/Order/Report/XML/GetCompanyByCity.aspx?City=' + city ,
7.         type: 'GET',
8.         dataType: 'xml',
9.         timeout: 10000,
10.         error: function()
11.         {
12.             alert('Error loading XML document');
13.         },
14.         success: function(xml)
15.         {               
16.             var str = "";
17.             $(xml).find("root").find("item").each(function()
18.             {
19.                 str += "<option value='" + $(this).attr("id") + "'>" + $(this).attr("name") + "</option>"               
20.             });
21.             $("#<%=ddlAgentID.ClientID%>").html(str);                       
22.         }
23.     });
24. }

最後一句是直接賦值 

 

下面是提供查詢資料庫的頁面，會返回xml格式的集合

public class GetCityByAreaRegion : System.Web.UI.Page

private void Page_Load(object sender, System.EventArgs e)
  {
   string strArea = Request.QueryString["Area"];
   if(strArea == null)
    strArea = "";

   XmlDocument doc = new XmlDocument();
   doc.LoadXml("<?xml version=/"1.0/" encoding=/"GB2312/" ?>/n<root/>");

   IList lst;
   if(strArea.Trim() == "")
   {
    lst = City.GetAllCitys();
   }
   else
   {
    lst = City.GetByAreaRegion(strArea);
   }

   StringBuilder buffer = new StringBuilder();

   buffer.Append("<root>");
   buffer.Append("<item code=/"/" name=/"全部/" />");

   for(int i=0;i<lst.Count;i++)
   {
    CityInfo info = (CityInfo)lst[i];

    buffer.AppendFormat("<item code=/"{0}/" name=/"{1}/" />",
     info.strName,info.strCodeName);
   }
   buffer.Append("</root>");

   doc.DocumentElement.InnerXml = buffer.ToString();

   Response.ContentType = "text/xml";
   doc.Save(Response.OutputStream);
   Response.End();
  }

當然記得引入js啦

<script language="javascript" src="<%=PageUtilityTool.GetRootURL()%>/js/jquery.js"></script>

 

jQuery 中文社區 http://wiki.jquery.org.cn/doku.php