Javascript 如何将创建的标记发送回服务器
我使用jquery插件为我的ASP.NET MVC站点上的帖子添加/创建标签。我使用的功能是“加载远程数据”和“标记支持”,如下所示:Javascript 如何将创建的标记发送回服务器,javascript,jquery,ajax,asp.net-mvc,jquery-select2,Javascript,Jquery,Ajax,Asp.net Mvc,Jquery Select2,我使用jquery插件为我的ASP.NET MVC站点上的帖子添加/创建标签。我使用的功能是“加载远程数据”和“标记支持”,如下所示: <script type="text/javascript"> function tagResultList(tag) { var counter = 'ny tagg'; var markup = "<table class='movie-result'>
<script type="text/javascript">
function tagResultList(tag) {
var counter = 'ny tagg';
var markup = "<table class='movie-result'><tr>";
markup += "<td class='movie-info'><div class='movie-title'>" + tag.text
if (typeof tag.count != 'undefined') {
counter = tag.count;
}
markup += "(" + counter + ")</div>";
markup += "</td></tr></table>"
return markup;
}
function tagResultSelectionName(tag) {
return tag.text;
}
$("#txtTagBox").select2({
multiple: true,
createSearchChoice:
function (term, data) {
if ($(data).filter(function () { return this.text.localeCompare(term) === 0; }).length === 0) {
return { id: 0, text: term };
}
},
placeholder: "Sök efter en tagg",
minimumInputLength: 3,
maximumInputLength: 30,
maximumSelectionSize: 5,
ajax: { // instead of writing the function to execute the request we use Select2's convenient helper
url: _tagsUrl,
dataType: 'json',
quietMillis: 100,
data: function (term, page) {
return {
q: term, // search term
page: page
};
},
results: function (data, page) { // parse the results into the format expected by Select2.
// since we are using custom formatting functions we do not need to alter remote JSON data
return { results: data.Tags, more: data.MorePages };
}
},
formatResult: tagResultList, // omitted for brevity, see the source of this page
formatSelection: tagResultSelectionName, // omitted for brevity, see the source of this page
dropdownCssClass: "bigdrop" // apply css that makes the dropdown taller
});
</script>
函数标记结果列表(标记){
变量计数器='ny tagg';
var标记=”;
标记+=“”+tag.text
if(typeof tag.count!=“未定义”){
计数器=tag.count;
}
标记+=“(“+计数器+”)”;
标记+=“”
返回标记;
}
函数标记ResultSelectName(标记){
返回tag.text;
}
$(“#txtTagBox”)。选择2({
多重:对,
createSearchChoice:
功能(术语、数据){
if($(data).filter(函数(){返回this.text.localeCompare(term)==0;}).length==0){
返回{id:0,text:term};
}
},
占位符:“Sök efter en tagg”,
最小输入长度:3,
最大输入长度:30,
最大选择大小:5,
ajax:{//我们使用Select2的方便助手,而不是编写函数来执行请求
url:_tagsUrl,
数据类型:“json”,
安静百万:100,
数据:功能(术语,第页){
返回{
q:term,//搜索术语
第页:第页
};
},
结果:函数(数据,页面){//将结果解析为Select2所需的格式。
//因为我们使用的是自定义格式函数,所以不需要更改远程JSON数据
返回{results:data.Tags,more:data.MorePages};
}
},
formatResult:tagResultList,//为简洁起见省略,请参阅此页面的源代码
formatSelection:TagResultSelectName,//为简洁起见省略,请参阅此页的源代码
dropdownCssClass:“bigdrop”//应用使下拉列表更高的css
});
我可以键入并选择一个新标记(创建新标记),但问题是提交文本框时会将Id 0转发到服务器,并且无法知道创建的标记的名称
那么,如何让它向服务发送字符串而不是id呢?或者可能存在一种混合模式,比如现有的id和创建的string
问候您试试看
function (term, page) {
return {
q: term, // search term
page: page
,newtag : 'created tag' //replace by var or jquery chain that'll return the string
}
它将以get数组的形式发送到带有索引newtag的_tagsurl,但您只是在这里修改查找函数?因此,当我键入一个新标记时,该函数将对键入的每个字母运行。如果最终用户在已加载列表中看不到标签,他可以单击他编写的标签,并将其添加到文本框(Id为o),直到提交后,服务才会知道最后一部分。问题是,提交表单时,viewModel将有一个类似于0、2、7的值,其中0是一个我们不知道名称的新标记。