Question

在下面的代码中，我正在使用ajax概念处理下拉列表。我的问题是我能够返回逗号separted和回调方法中的值，msg参数值是对象object.Pls帮助我解决问题。第二个下拉值没有约束力。

 $(document).ready(OnReady);

        function OnReady() {
           //Handle the change event for the drop down list
            $("#ddlLocation").change(onChange);
        }

        function onChange() {
            //create the ajax request
            $.ajax
        (
            {
                type: "POST", //HTTP method
                url: "NewIndent.aspx/OnContinentChange", //page/method name
                data: "{'continentName':'" + $("#<%=ddlLocation.ClientID%>").val() + "'}", //json to represent argument
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: callback,
                error: onError
            }
        );

        }

        //Handle the callback on success
        function callback(msg) {
            alert(msg);//it shows object object

            var countries = msg.split(';');
            var length = countries.length;


            document.getElementById('<%=ddlProduct.ClientID %>').options.length = 0;


            var dropDown = document.getElementById('<%=ddlProduct.ClientID %>');
            for (var i = 0; i < length - 1; ++i) {
                var option = document.createElement("option");
                option.text = countries[i];
                option.value = countries[i];

                dropDown.options.add(option);
            }
        }

        //Handle the callback on error
        function onError() {
            alert('something went wrong');
        }





[System.Web.Services.WebMethod]
        public static string OnContinentChange(int continentName)
        {
            MastersClient objProductName = new MastersClient();
            DataSet dsProduct = objProductName.GetLocationProductMap(continentName);
            DataTable firstTable = dsProduct.Tables[1];

            string result = string.Empty;

            foreach (DataRow r in firstTable.Rows)
            {
                result += r["ProductName"].ToString() + ";";
            }

            return result;//return all the values in comma separated
        }





<asp:DropDownList ID="ddlLocation" runat="server" style="width:40%;"  EnableViewState="true"        onchange="onChange()" />
                        <asp:DropDownList ID="ddlProduct" runat="server" OnSelectedIndexChanged="ddlProduct_SelectedIndexChanged"  AutoPostBack="true" Style="width: 100%; height:23px" ></asp:DropDownList>

Answer 1

使用此

dropDown.appendChild(option);

而不是

dropDown.options.add(option);

Answer 2

您获得了Json object作为key value pair的组合因此，请将success上的数据检索为

 success: function (object) {
                    $.each(object, function (key, val) {
                    alert(key);alert(val);
   })
 }


 function callback(msg) {
        alert(msg);//it shows object object

        var countries = msg.split(';');
        var length = countries.length;


        document.getElementById('<%=ddlProduct.ClientID %>').options.length = 0;
        var dropDown = document.getElementById('<%=ddlProduct.ClientID %>');
        $.each(msg, function (key, val) {                 
            var option = document.createElement("option");
            option.textContent = key;
            option.value = key;
            dropDown .appendChild(option);            
     })
    }

    //Handle the callback on error
    function onError() {
        alert('something went wrong');
    }

使用ajax概念下拉列表中的问题

2 个答案: