<asp:DropDownList onChange="GetChange(this);" id="drp1" runat="server"></asp:DropDownList>
<asp:DropDownList id="drp2" runat="server"></asp:DropDownList>
js指令碼:返回資料
function GetChange(drp)
{
var num = drp.options[drp.selectedIndex].value;
WebForm3.GetDrp(num,drp_CallBack);
}
function drp_CallBack(response)
{
if(response.error != null)
{
alert(response.error);
return;
}
var drp = document.getElementById("<% = drp2.ClientID %>");
var data = response.value;
if(data == null || typeof(data) != 'object')
{
return;
}
drp.options.length = 0;
for(i=0;i<data.length;i++)
{
var o = data[i];
drp.options[drp.options.length] = new Option(data[i],data[i]);
}
}
後台代碼實現
private void Page_Load(object sender, System.EventArgs e)
{
// 在此處放置使用者代碼以初始化頁面
Ajax.Utility.RegisterTypeForAjax(typeof(ZKMarketing.WebForm3));
if(!Page.IsPostBack)
{
for(int i=5;i<11;i++)
drp1.Items.Add(new ListItem(i.ToString(),i.ToString()));
drp2.Items.Add(new ListItem("請選擇","-1"));
}
}
[Ajax.AjaxMethod()]
public ArrayList GetDrp(int num)
{
ArrayList al = new ArrayList(num);
al.Clear();
for(int i=0;i<num;i++)
{
ListItem li = new ListItem(i.ToString(),i.ToString());
al.Add(li);
}
return al;
}
同時要設定web.Config檔案,
<httpHandlers>
<add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" />
</httpHandlers>
上面是我在做一個具體項目的時候,做的一個測試頁面,由於是第一次,所以就寫了上面的這樣一個簡單的測試頁面來實現AJAX,現在具體的項目中的功能也基本上完成。