If there are 5 or 10 items in select, pqgrid runs well, if there are 40 items or more in select editor, the select couldn't dropdow.
I'm using this way to bind data:
options: [
{ "SE": "Speedy Express" },
{ "UP": "United Package" },
{ "FS": "Federal Shipping" }
],
Here is part of my code:
var arrSelect = new Array(["/admin/codegen/tablesAutocomplete?datasource=main", 'mainTableName','name','name' ]
,["/admin/permission/dataAll", 'permissionId' ,'id','title']
,["/admin/permission/options", 'pid' ,'id','title']
);
var obj = {
height: 300,
colModel:gridColModel,
width:1700,
stripeRows: false,
saveUrl:saveUrl,
pageSize:pageSizeHyh,
create: function (evt, ui) {
var grid = this,column;
$.ajaxSettings.async = false
arrSelect.forEach(function(item){
$.getJSON(item[0], function (response) {
column = grid.getColumn({ dataIndx: item[1] });
var a = new Array();
var remoteData=(response.data.list?response.data.list:response.data);
if(remoteData==undefined ||remoteData== null) return;
for(let j=0,len=remoteData.length;j<len;j++){
var myObj={};
myObj[remoteData[j][item[2]]]= remoteData[j][item[3]];
if(j<30)
a.push(myObj);
}
column.cls='pq-drop-icon pq-side-icon';
column.editor={
type: 'select',
options: a,
init: function (ui) {
ui.$cell.find("select").pqSelect();
setTimeout(function () {
ui.$cell.find("select").pqSelect('open');
})
}
};
column.render=function (ui) {
var option = ui.column.editor.options.find(function (obj) {
return (obj[ui.cellData] != null);
});
return option ? option[ui.cellData] : "";
}
});
});
$.ajaxSettings.async = true;
this.widget().pqTooltip();
},
When I debug it, I find datasoure of select editor is OK, but they couldn't be show in browser. The reason is that too many items make select editor too long and out of the interface. But I couldn't find the solution.
