从jsonresult使用.each填充dropdownlist

我有一个下拉列表，我需要根据另一个的选择动态填充。这一切都可以达到我必须先清除列表之后才能在下拉列表中呈现新数据的程度。列表清除，但是然后无法填充从控制器返回的新数据。我正在尝试为此使用.each。从jsonresult使用.each填充dropdownlist

这里是有问题的控制器方法：

[AcceptVerbs(HttpVerbs.Get)] 
public JsonResult UpdateDocumentSubType(string DocumentType) 
{ 
    List<SelectListItem> DocumentSubTypeList = new List<SelectListItem>(); 
    PropertyModel model = new PropertyModel(); 
    int DocTypeID = 0; 
    //get DocTypeID 
    DocTypeID = model.GetDocTypeID(DocumentType); 
    //gets new document subtype list 
    DocumentSubTypeList = model.GetDocumentSubTypes(DocTypeID); 
    //return document subtype list 
    return Json(DocumentSubTypeList, JsonRequestBehavior.AllowGet); 
}

正如你所看到的，我返回列表的序列化JSON结果。

在看，我有以下几点：

$.ajax({ 
    url: '@Url.Action("UpdateDocumentSubType","Document")', 
    type: 'GET', 
    dataType: "json", 
    data: { DocumentType: SelectedDocTypeText }, 
    async: true, 
    success: function (data) { 
     var select = $("#Docs_DocumentSubTypeID"); 
     select.empty(); 
     $.each(data, function (index, item) { 
      select.append($('<option></option>').val(item).html(index)); 
     }); 
    } 
});

这是一切分崩离析。代码命中select.empty（）：并成功执行它，但作为SelectListItem的“文本”值，它提供了对象数组的索引元素。本质上，标签呈现如下：

<option value="[object Object]">1</option> 
<option value="[object Object]">2</option> 
<option value="[object Object]">3</option> 
<option value="[object Object]">4</option>

我已验证数据是否被传递。当我使用.each并将其放入自己的函数时，调用该函数并添加“调试器”。对此，我可以将所得到的“数据”中的数据看作[object，object]的四个元素。你可能已经猜到了，JQuery并不是我的强项，所以任何帮助都不胜感激。 :)

来源

2016-12-01 Brian Wetherell

你在'data'中得到了什么。你能把这个花在你的问题上吗？ –

首先，您不应该在UpdateDocumentSubType方法中返回List<SelectListItem> - 当您从未使用SelectListItem的额外属性时，没有意义将其返回给客户端。您只需返回一个包含2个属性的匿名对象，一个用于选项值，另一个用于显示文本。

您还没有显示的模型，但假定它包含属性说int ID和string Name，那么这将是（比方说）

var data = db.YourTable.Where(...).Select(x => new 
{ 
    Value = x.ID, 
    Text = x.Name 
}; 
return Json(data, JsonRequestBehavior.AllowGet);

之所以你看到value="[object Object]"是你返回复杂对象的数组因此中的item指的是包含属性的对象Value，Selected，Text,Group等。SelectListItem的属性），所以你的脚本需要是

$.each(data, function (index, item) { 
    select.append($('<option></option>').val(item.Value).html(item.Text)); 
});

来源

2016-12-02 02:06:22

我是新来的，所以这可能是不正确的。尝试

$('<option></option>').val(item[index]).html(index));

或

$('<option></option>').val(item[0]).html(index));

，而不是你写什么。

我需要一些更多信息。你可以分享github回购吗？

我的工作非常类似的东西，这就是我所做的：

（只看呈现从线85至96功能） https://github.com/stephenhu3/codepal/blob/development/js/youtubeComponent.js

它为我工作。

来源

2016-12-01 23:42:29 Programmerrrrr

从jsonresult使用.each填充dropdownlist

回答

相关问题