asp.net实现页面无刷新效果

下拉框二级联动,页面无刷新

A. (aspx)

    <asp:DropDownList ID="DropDownList1" runat="server" Height="16px" 
        onchange="getChildren(this.options[this.selectedIndex].value, 'ddl');"  Width="139px">
        <asp:ListItem Value="0">请选择</asp:ListItem>
        <asp:ListItem Value="BJ">北京</asp:ListItem>
        <asp:ListItem Value="TJ">天津</asp:ListItem>
        <asp:ListItem Value="HB">湖北</asp:ListItem>
    </asp:DropDownList>
    <asp:DropDownList ID="ChildDropDown" runat="server" Width="60">
    </asp:DropDownList>
    </p>
 <script language="javascript"> 
     function ClientCallback(result, context) { 
         var childDropDown = document.getElementById("MainContent_ChildDropDown"); 
         if (!childDropDown) {
             return;
         } 
         childDropDown.length = 0; 
         if (!result) {
             return;
         } 
         var rows = result.split('|');
         for (var i = 0; i < rows.length; ++i) {
             var option = document.createElement("OPTION");
             option.value = rows[i];
             option.innerHTML = rows[i];
             childDropDown.appendChild(option);
         } 
         childDropDown.style.visibility = "visible";
     }

     function ClientCallbackError(result, context) {
         alert(result);
     } 
   </script>

B.(cs 文件)

 1.  实现ICallbackEventHandler 接口

2.向客户端注册回传方法
protected void Page_Load(object sender, EventArgs e)
{
   //向客户端注册事件 ClientCallback,ClientCallbackError 前台页面实现的JavaScript方法
   string callBack = Page.ClientScript.GetCallbackEventReference(this, "arg", "ClientCallback", "context", "ClientCallError", false);
   string clientFunction = "function getChildren(arg,context){"+callBack+";};";
   Page.ClientScript.RegisterClientScriptBlock(this.GetType(),"getChildren",clientFunction,true);
}
//3.实现接口两个方法
string callBackResult = "";
public string GetCallbackResult()
{
   return callBackResult;
}
     
public void RaiseCallbackEvent(string eventArgument)
{ 
   switch (eventArgument)
   { 
        case "BJ":
             callBackResult = "One|Two|Three";
             break;
        case "TJ":
             callBackResult = "Four|Five|Six";
             break;
        case "HB":
             callBackResult = "Seven|Eight|Nine";
              break;
        default :
             callBackResult = "";
             break;
  }
}

 

posted @ 2012-12-10 23:38  csdnbbs  阅读(227)  评论(0编辑  收藏  举报