EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: zhangjian420 on January 16, 2022, 02:12:41 AM



Title: There are some bugs in the tagbox plugin
Post by: zhangjian420 on January 16, 2022, 02:12:41 AM
Ver:1.10.1
The tagbox is inherited from the ComboBox plugin, so I can use all the properties in the ComboBox plugin. When I use mode: "remote" in tagbox I got some exceptions.
Code:
<input name="item.graph_id" class="form-control easyui-tagbox" id="graph_id"
data-options="required:true,valueField:'id',textField:'title',hasDownArrow: true,limitToList: true,
url:'#(path)/graph/listj',mode:'remote',delay:500,"
value="#(item.graph_id??)">
1、When you directly select some options from the drop-down options, and then enter some words, the selected value suddenly becomes the result of id. Finally, delete all the selected values, click the drop-down button, and find that the drop-down options are not the same as the beginning.

2、Chinese internationalization of tagbox is wrong, still in English


Title: Re: There are some bugs in the tagbox plugin
Post by: jarry on January 18, 2022, 12:03:20 AM
Please override the 'tagFormatter' function to achieve your requirement.
Code:
$('#cc').tagbox({
onBeforeLoad: function(){
var data = $(this).tagbox('getData');
var opts = $(this).tagbox('options');
var values = $(this).tagbox('getValues');
opts.mappingRows = opts.mappingRows||[];
data = data.concat(opts.mappingRows);
for(var i=0; i<values.length; i++){
var item = $.easyui.getArrayItem(data, opts.valueField, values[i]);
if (item){
var row = $.easyui.getArrayItem(opts.mappingRows, opts.valueField, values[i]);
if (!row){
opts.mappingRows.push(item);
}
}
}
},
tagFormatter: function(value,row){
var opts = $(this).tagbox('options');
if (row && row[opts.textField]){
return row[opts.textField];
}
var mappingRows = opts.mappingRows||[];
var item = $.easyui.getArrayItem(mappingRows, opts.valueField, value);
return item ? item[opts.textField] : value;
}
})


Title: Re: There are some bugs in the tagbox plugin
Post by: zhangjian420 on January 19, 2022, 05:58:27 PM
thank you very much for your reply!
But there are still some problems.When mode: 'remote', after entering some words in the tagbox, the drop-down list will find some matching options, but the entered words suddenly disappear. combobox does not have this problem

If I don't select any of the options in the drop-down, clicking the drop-down button again will find that the drop-down options are the ones that matched the word I just entered, not all of them.

Please override the 'tagFormatter' function to achieve your requirement.
Code:
$('#cc').tagbox({
onBeforeLoad: function(){
var data = $(this).tagbox('getData');
var opts = $(this).tagbox('options');
var values = $(this).tagbox('getValues');
opts.mappingRows = opts.mappingRows||[];
data = data.concat(opts.mappingRows);
for(var i=0; i<values.length; i++){
var item = $.easyui.getArrayItem(data, opts.valueField, values[i]);
if (item){
var row = $.easyui.getArrayItem(opts.mappingRows, opts.valueField, values[i]);
if (!row){
opts.mappingRows.push(item);
}
}
}
},
tagFormatter: function(value,row){
var opts = $(this).tagbox('options');
if (row && row[opts.textField]){
return row[opts.textField];
}
var mappingRows = opts.mappingRows||[];
var item = $.easyui.getArrayItem(mappingRows, opts.valueField, value);
return item ? item[opts.textField] : value;
}
})