ParamQuery grid support forum
General Category => Bug Report => Topic started by: hyh888 on October 27, 2022, 01:32:45 pm
-
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.
-
Please share a screenshot with 5 items and 40 items.
and it would be great if you share a jsfiddle.
-
Here are three screen shot for fuctional, partially fucntional and malfunction cases.
-
this is functional case
-
partial functional
-
It seems that vertical scrollbar in select editor disappeared.
-
it seems that div.pq-select-menu couldn't be rendered, even it is rendered, there is problem for its height.
-
Using pqselect.dev.js to debug it, it seems that div.pa-select-search-div could not be found, that.$selectAll.outerHeight(true) also has no value.
-
Have you included the pqselect css file?
If yes then kindly share a jsfiddle.
-
The pqselect css file is included. For all my data is come from server side and I don't know how to show them in the jsfiddle.
If using a fixed integer to replace the htFinal(just like what I do in the last image I uploaded), the select editor can work though it not satisfied for me.
If it's convenient you can look it wiht remote control software.
-
For I'm in China, it seems I couldn't visit the jsfiddle website.
After redebuging, I found that "that.$popup.find(".pq-select-search-div").outerHeight(true)" is OK, but "that.$selectAll.outerHeight(true)" is undefined.
"that.$selectAll" is available.
-
Can you please replace remote data with local data and send the reproducible complete issue in attachment.
-
Even I tried, but I found that the file is too big. I have to removed some file. You have to put jquery.min.js(jQuery v3.3.1),jquery-ui.min.js(jQuery UI - v1.12.1 - 2016-09-14),pqgrid.min.js(ParamQuery Pro v8.6.0) manually into the BDMS_files directory.
-
here are jquery
-
I upload jqueryui many times but always failed. PQgrid is too big to be uploaded.
-
you may send the attachment to support at paramquery.com
-
Now only pqgrid.min.js(ParamQuery Pro v8.6.0) is not uploaded, I'm sure you have this file.
-
Dear paramvir,
Have you find any solution for my question?
-
Sorry for the delay. one of your attachment has lot of files ( lools like entire project ) and other one is complaining of virus in it.
Please make an isolated test case and share only that. Please use any other live code sharing platform similar to jsfiddle which works in your location.
-
Would you like to let me know which file is alerted for virus? I'm using visual studio 2019 to make the simplest project. I'll try my best to find a living demo website.
-
All code are uploaded into http://cdn.jsrun.top/res/hyh888/BDMS.html, would you like to try it?
-
http://cdn.jsrun.top/res/hyh888/index.html has less 404 error, maybe it's more friendly for debug.
-
Thanks, I'm looking into it.
-
It's realy a pity to make so much trouble to spot it as a bug.
-
This is fixed in v8.7.0