JQuery选择了动态ajax调用选项重复问题,如果使用empty()元素,则会丢失默认选择值


$(this.el).ready(function(){
setTimeout(function(){
var subItemsData = [];
$(self.el).chosen({
width: '100%',
allow_single_deselect: true,
no_results_text: "Oops, nothing found!",
search_contains: false,
max_selected_options: self.params.maxselected ? self.params.maxselected : 0
}).on('change', function(evt, params) {
var value = $(self.el).val();
self.set(value);
console.log("value",value);
}).on('chosen:showing_dropdown', function(evt, params) {
})

$('#patient_diagnosis_chosen ul li.search-field input').autocomplete({
source: function( request, response ) {
if(request.term.length >= self.params.minlength){
$.ajax({
url: baseURL+'api/service/v1/get-data',
dataType: "json",
method:'post',
data:{
'ids':$(self.el).val(),
'key':request.term
},
success: function( data ) {
var subItems=[]
data.input_data.forEach((item,index)=>{

subItems.push( "<option value="+item.id+">"+ item.code +' - '+item.short_description  + "</option>" );
subItemsData.push(item) 
})

$(self.el).append(subItems).trigger("chosen:updated");
}
});
}
}
}); 

},100);     
});

这个代码可以调用api并得到api响应,但问题是如果我使用,选项是重复的

$(self.el).empty().append(subItems).trigger("chosen:updated");

则丢失默认选择值

如果可以清空元素并设置默认元素。

这个问题已经解决了,这个代码对我来说是有效的。

var self = this;
// var ids=[]
$(this.el).ready(function(){
setTimeout(function(){
$(self.el).chosen({
width: '100%',
allow_single_deselect: true,
no_results_text: "Oops, nothing found!",
search_contains: false,
max_selected_options: self.params.maxselected ? self.params.maxselected : 0
}).on('change', function(evt, params) {
var value = $(self.el).val();
// ids = $(self.el).val();
self.set(value);
console.log("value",value);
}).on('chosen:showing_dropdown', function(evt, params) {
})

$('#patient_diagnosis_chosen ul li.search-field input').autocomplete({
source: function( request, response ) {
if(request.term.length >= self.params.minlength){
$.ajax({
url: baseURL+'api/service/v1/get-data',
dataType: "json",
method:'post',
data:{
'ids':$(self.el).val(),
'key':request.term
},
success: function( data ) {
var subItems=[]
var ids=$(self.el).val()
data.input_data.forEach((item,index)=>{
subItems.push( "<option  value="+item.id+">"+ item.code +' - '+item.short_description  + "</option>" );
})
$(self.el).empty().append(subItems).trigger("chosen:updated");
var test = $.trim(ids);
var testArray = test.split(',');
$(self.el).val(testArray).trigger("chosen:updated");
}
});
}
}
}); 
},100); 

});

当用选定的值调用ajax时,它会给出响应,然后清空元素,然后在选定的中再次设置选定的值

Api响应具有选定值

最新更新