Ajax Dropdownlist级联选择

1.首先，把Ajax.dll这个文件应用到你的工程文件中，然后在配置文件的<HttpHandlers>下引入这个dll文件

：<add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax"/>

然后在服务端给第一个DropdownList中直接绑定数据；

2..在公共代码中加上你要Ajax帮你回传的数据；

public class AjaxMethod

{

    private DatabaseGateway database;

    private static string constr = ConfigurationManager.ConnectionStrings["StaffingConnectionString"].ConnectionString;

    SqlConnection conn = new SqlConnection(constr);

    private const string Account_ReceiverByID_SQL = "SELECT * FROM vwStaffingTeamUsers Where[email protected]";

    [Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]

    public DataTable GetReceiverList(int accountID)//这个方法在下面的js中会调用从而在客户端得到数据，再在JS中解析为要级联的控件绑定数据

    {

        DataTable dt = new DataTable();

        SqlParameter[] paralist = new SqlParameter[] { new SqlParameter("@ProjectID", accountID) };

        try

        {

            database = new DatabaseGateway(conn);

            dt = database.QueryForDataTable(Account_ReceiverByID_SQL, paralist);

        }

        catch (SqlException ex)

        {

            throw new ITAMSArgumentException(ex.Message, ex);

        }

        finally

        {

            database.CloseSession();

        }

        return dt;

    }

}

3.在服务端注册这个公共类的方法，为了使他能让客户端直接调用；

        protected void Page_Load(object sender, EventArgs e)

        {

            Ajax.Utility.RegisterTypeForAjax(typeof(AjaxMethod));

            if (!this.IsPostBack)

            {

                this.ddlOwnerAccount.Attributes.Add("onclick", "accountResult();");

            }

        }

4.其次，这是aspx文件中的代码，包括两个dropdownlist控件和两个要调用的JavaScript代码;

<script language="javascript">

    function accountResult() {

        var account = document.getElementById("ddlOwnerAccount客户端的ID");

        AjaxMethod.GetReceiverList(account.value, get_account_Result_CallBack);

    }

    function get_account_Result_CallBack(response) {

        if (response.value != null) {

            //debugger;

            document.all("ddlReceiver客户端的ID").length = 0;

            var data = response.value;

                for (var i = 0; i < data.Rows.length; i++) {

                    var EngineerName = data.Rows[i].EngineerName;

                    var EngineerID = data.Rows[i].EngineerID;

                    document.all("ddlReceiver客户端的ID").options.add(new Option(EngineerName, EngineerID));

                }   

        }

        else {

            document.all("ddlReceiver").length = 0;

        }

        return

    }

</script>

<div>

    <%--    <table class="full">--%>

       <tr>

             <td class="subtitle">

                 <asp:Label  ID="lblOwnerAccount" runat="server" Text="Owner Account :"></asp:Label>

             </td>

            <td>

                <asp:DropDownList ID="ddlOwnerAccount" runat="server">

                </asp:DropDownList>

                <asp:Label ID="labDdlOwnerAccount" runat="server"  ForeColor="Red" Text="*"></asp:Label>

            </td>

            <td class="subtitle">

            <asp:Label  ID="lblReceiver" runat="server" Text="Receiver :"></asp:Label>

            </td>

            <td>

                <asp:DropDownList ID="ddlReceiver" runat="server"> 

                </asp:DropDownList>

            </td>

            <td>

            </td>

     </tr>

   <%--    </table>--%>

</div>

4.至此就完成无刷新的级联控件。