ASP.NET / Webforms / C＃-基於第一個下拉列表填充第二個下拉列表，而無需回發，綁定后的代碼

Question

請幫忙。

我有3個下拉列表：1.國家2.端口3.公司名稱

選擇第一個下拉列表（國家/地區）后，應使用特定端口列表填充第二個下拉列表，然后根據第一個和第二個下拉列表，也將填充第三個下拉列表。

這是一次性鍵入。 這意味着選擇完成后，用戶會將其保存在db中，並且除非用戶更改，否則該值應保留在下拉列表中。

現在，我正在使用OnSelectedIndexChanged，由於回發，它非常慢。

讓我知道是否還有其他方法。

謝謝傑克

Answer 1

可能有幾種方法可以實現這一目標。 一種方法是使用WebService [WebMethod]。 Ajax和JSON。

//You databinding method must be public and add [WebMethod] attribute
[WebMethod]
public static List<ListItem> GetCustomers()
{
    string query = "SELECT CustId, CustName FROM Customers";
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
    using (SqlCommand cmd = new SqlCommand(query))
    {
        List<ListItem> custListItem = new List<ListItem>();
        cmd.CommandType = CommandType.Text;
        cmd.Connection = con;
        con.Open();
        using (SqlDataReader sdr = cmd.ExecuteReader())
        {
            while (sdr.Read())
            {
                custListItem.Add(new ListItem
                {
                    Value = Convert.ToString(sdr["CustId"]),
                    Text = Convert.ToString(sdr["CustName"])
                });
            }
        }
        con.Close();
        return custListItem;
    }
}
}

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
    $.ajax({
        type: "POST",
        url: "CustomerList.aspx/GetCustomers",
        data: '{}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (r) {
            var ddlCustomers = $("[id*=ddlCustomers]");
            ddlCustomers.empty().append('<option selected="selected" value="0">Please select</option>');
            $.each(r.d, function () {
                ddlCustomers.append($("<option></option>").val(this['Value']).html(this['Text']));
            });
        }
    });
});
</script>

Answer 2

您基本上有2個選擇，將值預加載到js結構中（縣，港口和公司），或使用ajax / xmlhttprequest調用僅加載相關信息（僅加載特定國家/地區的端口）。 如果要預加載值，則可以將其與腳本標記正文中的html混合使用，也可以將其作為通過src屬性加載的單獨文件。

哪種方法最適合使用，取決於您的用戶群和數據大小以及數據更改的頻率。