Javascript 选择2按选项值自动完成

Javascript 选择2按选项值自动完成,javascript,jquery,css,jquery-select2,select2,Javascript,Jquery,Css,Jquery Select2,Select2,我已尝试为我的站点集成标记/自动完成。它通过选项文本工作。我几乎接近结果,但仍然悬而未决 现在,当您尝试选择选项文本时,将出现相关文本。但现在我想通过选项值搜索加德满都或相关选项文本 例: 当我们搜索时,将出现a001加德满都,并选择与a002相同的值,它将出现博卡拉 $(“选择”)。选择2({ 标签:“真”, 占位符:“选择一个选项”, allowClear:是的, 宽度:“100%”, createTag:函数(参数){ 变量项=$.trim(参数项); 如果(术语==''){ 返回nul

我已尝试为我的站点集成标记/自动完成。它通过选项文本工作。我几乎接近结果,但仍然悬而未决

现在,当您尝试选择选项文本时,将出现相关文本。但现在我想通过选项值搜索加德满都或相关选项文本

例: 当我们搜索时,将出现a001加德满都,并选择与a002相同的值,它将出现博卡拉

$(“选择”)。选择2({
标签:“真”,
占位符:“选择一个选项”,
allowClear:是的,
宽度:“100%”,
createTag:函数(参数){
变量项=$.trim(参数项);
如果(术语==''){
返回null;
}
返回{
id:术语,
案文:任期,
值:true//添加其他参数
}
}
});
。选择2容器{
最大宽度:400px;
}

加德满都
博卡拉
拉利特普尔

如果搜索
a001
,则输出为输出中的显示id和文本。学习

如果该值是一个对象,则该对象应与 选择2的内部对象。id应该是要在何时查找的id 确定是否应显示占位符。案文应为: 选择该选项时要显示的占位符

示例:在输入displaykatmandua001后在文本框中搜索
a001

在select2中使用占位符

placeholder: {
        id: "-1",
        text: "Select an option",
      } 
$(“选择”)。选择2({
标签:“真”,
占位符:{
id:“-1”,
文本:“选择一个选项”,
}, 
allowClear:是的,
宽度:“100%”,
createTag:函数(参数){
变量项=$.trim(参数项);
如果(术语==''){
返回null;
}
返回{
id:术语,
案文:任期,
值:true//添加其他参数
}
}
});
。选择2容器{
最大宽度:400px;
}

加德满都
博卡拉
拉利特普尔

要删除仅输入
Id
时显示的
Id
文本的双重重叠,请检查输入的术语是否与现有
Id
匹配,如果它只返回匹配选项的
文本

options=[];
//为查找创建一个选择选项数组
$('.custom select option')。每个(函数(idx){
options.push({id:$(this.val(),text:$(this.text()});
});
$(“选择”)。选择2({
标签:“真”,
占位符:“选择一个选项”,
allowClear:是的,
宽度:“100%”,
createTag:函数(参数){
变量项=$.trim(参数项);
如果(术语==''){
返回null;
}
//检查术语是否与id匹配
var search=$.grep(选项,函数(n,i){
return(n.id==term | | n.text==term);//检查id和文本
});
//如果找到匹配项,请将术语替换为选项文本
if(search.length)
术语=搜索[0]。文本;
其他的
return null;//与id或文本值不匹配,因此不要将其添加到选择中
返回{
id:术语,
案文:任期,
值:true//添加其他参数
}
}
});
$('select')。打开('select2:select',函数(evt){
//控制台日志(evt);
//返回false;
});
。选择2容器{
最大宽度:400px;
}

加德满都
博卡拉
拉利特普尔

是的,但我不需要在现场使用a001。只需展示加德满都或拉利特普尔。现在显示的价值和文本感谢很多朋友。我感谢如果禁用选择除列表外的选项。现在它是通过ID工作的。现在我们可以避免选择这个标签了吗?好的,这应该很容易,只要在不匹配时返回
null
。我会更新代码。。。