如何填写使用jQuery AJAX调用下拉？ [英] How to fill a DropDown using Jquery Ajax Call?

问题描述

我有一个WebMethod它得到了我想要填充下拉与DataSet中的数据。 目前我使用填充硬codeD对象下拉。但我想与WebMethod的返回的数据替换此硬盘codeD对象。

  [System.Web.Services.WebMethod]
         公共静态字符串GetDropDownDataWM（字符串名称）
         {
             //返回你好+姓名+ Environment.NewLine +当前时间为：
             // + DateTime.Now.ToString（）;

             VAR味精=arbaaz;

             字符串[]名1 =新的字符串[1];
             字符串[]值=新的字符串[1];
             名1 [0] =@的Emp code;
             。值[0] = HttpContext.Current.Session [LoginUser]的ToString（）修剪（）;
             的DataSet ds为新的DataSet（）;
             dboperation DBO =新dboperation（）;
             DS = dbo.executeProcedure（GetDropDownsForVendor，名称1，数值，1）;

             返回ds.GetXml（）;

         }
 

客户端（更新1）：

 ＆LT;脚本类型=文/ JavaScript的＆GT;
    传播GetDropDownData（）{
        VAR myDropDownList = $（'myDropDownLisTId。'）;

        $阿贾克斯（{
            键入：POST，
            网址：Test.aspx的/ GetDropDownDataWM
            数据：{名字：ABC}
            的contentType：应用/ JSON的;字符集= UTF-8，
            数据类型：JSON，
            成功：功能（数据）{
                $每个（jQuery.parseJSON（data.d），函数（）{
                    myDropDownList.append($("<option></option>").val(this['FieldDescription']).html(this['Field$c$c']));
                }）;
            }，
            失败：功能（响应）{
                警报（response.d）;
            }
        }）;
    }
    功能的onSuccess（响应）{
        执行console.log（response.d）;
        警报（response.d）;
    }
＆LT; / SCRIPT＆GT;
 

解决方案

 函数GetDropDownData（）{
    $阿贾克斯（{
        键入：POST，
        网址：Test.aspx的/ GetDropDownDataWM
        数据：{名字：ABC}
        的contentType：应用/ JSON的;字符集= UTF-8，
        数据类型：JSON，
        成功：函数（data.d）
                {
                    $每个（data.d，函数（）{
                        $（myDropDownLisTId。）追加（$（＆LT;选项/>").val(this.KeyName).text(this.ValueName））。
                    }）;
                }，
        失败：函数（）{
            警报（失败！）;
        }
    }）;
}
 

I have a WebMethod which gets data that I want to fill DropDown with in a DataSet. Currently I am filling the dropdown using a hardcoded object. But I want to replace this hard coded object with data returned by webmethod.

 [System.Web.Services.WebMethod]
         public static string GetDropDownDataWM(string name)
         {
             //return "Hello " + name + Environment.NewLine + "The Current Time is: "
             //    + DateTime.Now.ToString();

             var msg = "arbaaz";

             string[] name1 = new string[1];
             string[] Value = new string[1];
             name1[0] = "@Empcode";
             Value[0] = HttpContext.Current.Session["LoginUser"].ToString().Trim();
             DataSet ds = new DataSet();
             dboperation dbo = new dboperation();
             ds = dbo.executeProcedure("GetDropDownsForVendor", name1, Value, 1);

             return ds.GetXml(); 

         }

CLIENT SIDE(UPDATE 1):

  <script type = "text/javascript">
    function GetDropDownData() {
        var myDropDownList = $('.myDropDownLisTId');

        $.ajax({
            type: "POST",
            url: "test.aspx/GetDropDownDataWM",
            data: '{name: "abc" }',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                $.each(jQuery.parseJSON(data.d), function () {
                    myDropDownList.append($("<option></option>").val(this['FieldDescription']).html(this['FieldCode']));
                });
            },
            failure: function (response) {
                alert(response.d);
            }
        });
    }
    function OnSuccess(response) {
        console.log(response.d);
        alert(response.d);
    }
</script>

解决方案

function GetDropDownData() {
    $.ajax({
        type: "POST",
        url: "test.aspx/GetDropDownDataWM",
        data: '{name: "abc" }',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data.d)
                {
                    $.each(data.d, function (){
                        $(".myDropDownLisTId").append($("<option     />").val(this.KeyName).text(this.ValueName));
                    });
                },
        failure: function () {
            alert("Failed!");
        }
    });
}

这篇关于如何填写使用jQuery AJAX调用下拉？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！