使用字符串元素列表作为 Select2 组件的源
Using a list of string elements as source for Select2 component
我正在尝试为我正在处理的这个网站制定一个标签控制器,但我无法让 json 部分正常工作。
从顶部开始,我在我的cshtml视图中有一个隐藏的输入元素(JS从这个SO帖子中获取):
<input type="hidden" id="tagController" style="width: 350px;" />
...
$(document).ready(function () {
var lastResults = [];
$("#tagController").select2({
multiple: true,
placeholder: "Please enter tags",
tokenSeparators: [","],
ajax: {
multiple: true,
url: "/UnitDetails/GetTagsAsJson/",
dataType: "json",
type: "POST",
data: function (term, page) {
return {
json: JSON.stringify({ results: [{ id: "foo", text: "foo" }, { id: "bar", text: "bar" }] }),
q: term
};
},
results: function (data, page) {
lastResults = data.results;
return data;
}
},
createSearchChoice: function (term) {
var text = term + (lastResults.some(function (r) { return r.text == term }) ? "" : " (new)");
return { id: term, text: text };
},
});
});
然后,我的控制器中有一个操作:
[HttpPost]
public JsonResult GetTagsAsJson()
{
return Json(Model.TagsAvailable, JsonRequestBehavior.AllowGet);
}
然后,在我的索引操作中填充列表TagsAvailable
:
...
foreach (var tag in GetAvailableTags())
{
Model.TagsAvailable.Add(tag.Name);
}
...
最后,GetAvailableTags()
调用一个 wcf 服务,该服务在BaseTagController
中返回一组 TagContracts:
public List<TagContract> GetAvailableTags()
{
return UnitClient.GetAllUnitTags().Select(unitTag => new TagContract
{
Id = unitTag.Id,
Name = unitTag.Name
}).ToList();
}
在 chrome 中检查控制台时,出现以下错误: Failed to load resource: the server responded with a status of 500 (Internal Server Error)
作为记录,我知道服务返回请求的数据,我想这更多的是我编写的代码的问题:)
遇到了一个教程,它帮助我完成了我想要的。只需重写代码以匹配我的值即可。
Github代码可以在这里找到。
相关文章:
- React重新渲染但未显示正确的组件
- 不能从angular2中的子组件指定父组件中的数组
- 拨打'父亲'函数形式a'儿童'ReactJS中的组件
- React组件等待所需道具进行渲染
- 如何创建带有插槽的vue js组件预加载程序
- KnockoutJS-组件-多个实例
- 如何更改reactjs中外部/独立组件的状态或属性
- 阻止在select2单击时调用ajax
- 如何在react js中将值从一个组件发送到另一个组件
- React Native通过Navigator将用户输入数据传递到选项卡栏IOS中的组件
- React组件-设置页面标题
- 我的shareService在angular 2中发送值工作正常,但当我渲染我的另一个组件时,会获得默认值
- 如何在salesforce aura闪电组件中使用jQuery.val()
- 为react组件传递道具的最佳方式
- [Vue warn]:未能解析组件
- 如何控制组件'的createContent函数被激发
- react组件中的绑定方法
- 使用字符串元素列表作为 Select2 组件的源
- 使用Select2组件预选择时间
- 如何将复杂样式应用于Select2组件的选择