如何使用jQuery将JSON数据绑定到Asp.net MVC中的dropdownlist

我正在尝试将JSON数据绑定到下拉列表

我的场景是我想获取数据并绑定到动态下拉列表，

在Seperate Class中，我使用linq来获取数据

public SelectList getProjects() { IEnumerable projectslist = (from proj in res.PROJECTs where proj.IS_DELETED == "N" select proj).AsEnumerable().Select(projt => new SelectListItem() { Text = projt.NAME, Value = projt.ID.ToString() }); return new SelectList(projectslist, "Value", "Text", PROJ_ID); } 

在控制器中：

 ViewBag.ProjectList=(from proj in res.PROJECTs where proj.IS_DELETED == "N" select proj).AsEnumerable().Select(projt => new SelectListItem() { Text = projt.NAME, Value = projt.ID.ToString() }); 

在视图中：

  @for (int i = 0; i  m.GetTimeSheetDetails[i].PROJ_ID, (SelectList)ViewBag.ProjectList, "-- Choose a Project --", new { @class = "ddlProjectvalue" }) } 

现在，我正在尝试，如果我们有三个下拉列表，我们在第一个下拉列表中选择一个列表项不应该显示在第二个下拉列表中，并且在第三个下拉列表中不应该显示以前选择的列表项，因为我有像这样的写入脚本：

   $(document).ready(function () { $('.ddlProjectvalue').change(function () { debugger; var selectedValue = $(this).val(); if (selectedValue != null && selectedValue != '') { debugger; $.ajax({ type: "GET", contentType: "application/json; charset=utf-8", url: "/Employer/GetDDLData?selectedValue="+selectedValue, data: "{}", dataType: "Json", success: function (data) { // first remove the current options if any $('.ddlProjectvalue').find('option').remove(); // next iterate thru your object adding each option to the drop down\ $(data).each(function (index, item) { // GETTING ERROR HERE debugger; $('.ddlProjectvalue').append($('').val(item.Value).html(item.Text)); }); }, error: function ajaxError(response) { alert(response.status + ' ' + response.statusText); } }); } }); });  

我从Controller返回JSON数据：

  public ActionResult GetDDLData(string selectedValue) { int projectid = Convert.ToInt32(selectedValue); IEnumerable projectslist = (from proj in db.PROJECTs where proj.IS_DELETED == "N" && proj.ID != projectid select proj).AsEnumerable().Select(projt => new SelectListItem() { Text = projt.NAME, Value = projt.ID.ToString() }); var result = new SelectList(projectslist, "Value", "Text", tm.PROJ_ID); return Json(result, JsonRequestBehavior.AllowGet); } 

我试过，但得到错误就好

  "Syntax error, Unrecognized Expression" 

在我做错的地方，请帮助我。

Answer 1

这将有助于您：

 $.ajax({ url: "@Url.Action("GetDDLData","Employer")", data: {selectedValue:selectedValue}, dataType: "json", type: "GET", error: function () { alert(" An error occurred."); }, success: function (data) { var optionhtml1 = '' + "--Select State--" + ''; $(".ddlProjectvalue").append(optionhtml1); $.each(data, function (i) { var optionhtml = '' +data[i].Text + ''; $(".ddlProjectvalue").append(optionhtml); }); } }); 

Answer 2

 //Controller Code public ActionResult getAccount() { var result = new SelectList(db.Partymsts, "Account", "Account"); return Json(result, JsonRequestBehavior.AllowGet); } // js code $.ajax({ type: "POST", url: "/NewMaster/getAccount", dataType: "json", contentType: "application/json; charset=utf-8", success: function (data) { var optionhtml1 = '' + "--Select State--" + ''; $(".cs3").append(optionhtml1); $.each(data, function (i) { var optionhtml = '' +data[i].Text + ''; $(".cs3").append(optionhtml); }); } }); // html code   its working !! 

Answer 3

如果你的json是正确的，下面的方法就可以了。在你的ajax成功中输入代码

 success:function(data){ $('.ddlProjectvalue').empty(); $.each(data,function (index, item) { $('.ddlProjectvalue').append$('', { value: item.Value, text: item.Text }, '') } ); } 

Answer 4

我们这样做了

Dropdown.append($('').val(item.col1).text(item.col2));