ParamQuery grid support forum

General Category => Bug Report => Topic started by: hyh888 on October 27, 2022, 01:32:45 pm

Title: Too many item in select, make select editor out of function
Post 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.
Title: Re: Too many item in select, make select editor out of function
Post by: paramvir on October 27, 2022, 03:11:05 pm
Please share a screenshot with 5 items and 40 items.

and it would be great if you share a jsfiddle.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 27, 2022, 06:34:43 pm
Here are three screen shot for fuctional, partially fucntional and malfunction cases.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 27, 2022, 06:49:09 pm
this is functional case
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 27, 2022, 06:52:06 pm
partial functional
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 27, 2022, 07:07:41 pm
It seems that vertical scrollbar in select editor disappeared.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 27, 2022, 08:00:18 pm
it seems that div.pq-select-menu couldn't be rendered, even it is rendered, there is problem for its height.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 28, 2022, 07:09:42 am
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.
Title: Re: Too many item in select, make select editor out of function
Post by: paramvir on October 28, 2022, 02:10:42 pm
Have you included the pqselect css file?

If yes then kindly share a jsfiddle.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 28, 2022, 04:24:57 pm
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.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 28, 2022, 06:11:17 pm
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.
Title: Re: Too many item in select, make select editor out of function
Post by: paramvir on October 28, 2022, 09:44:40 pm
Can you please replace remote data with local data and send the reproducible complete issue in attachment.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 30, 2022, 03:59:26 pm
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.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 30, 2022, 07:04:16 pm
here are jquery
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 31, 2022, 06:04:40 am
I upload jqueryui many times but always failed. PQgrid is too big to be uploaded.
Title: Re: Too many item in select, make select editor out of function
Post by: paramvir on October 31, 2022, 06:29:10 am
you may send the attachment to support at paramquery.com
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on October 31, 2022, 12:57:27 pm
Now only pqgrid.min.js(ParamQuery Pro v8.6.0) is not uploaded, I'm sure you have this file.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on November 04, 2022, 06:04:51 am
Dear paramvir,
Have you find  any solution for my question?
Title: Re: Too many item in select, make select editor out of function
Post by: paramvir on November 07, 2022, 07:14:35 am
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.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on November 07, 2022, 01:12:00 pm
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.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on November 10, 2022, 06:48:40 am
All  code are uploaded into http://cdn.jsrun.top/res/hyh888/BDMS.html, would you like to try it?
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on November 10, 2022, 12:21:05 pm
http://cdn.jsrun.top/res/hyh888/index.html   has less 404 error, maybe it's more friendly for debug.
Title: Re: Too many item in select, make select editor out of function
Post by: paramvir on November 10, 2022, 02:10:19 pm
Thanks, I'm looking into it.
Title: Re: Too many item in select, make select editor out of function
Post by: hyh888 on November 16, 2022, 07:47:08 am
It's realy a pity to make so much trouble to spot it as a bug.
Title: Re: Too many item in select, make select editor out of function
Post by: paramvir on January 12, 2023, 07:24:16 am
This is fixed in v8.7.0