Need to double click on a drop down to select a value

[applepqgrid]

Hi PQGrid Team,

We have a pro account and we are stuck with below issue.

Issue Description:

We are using PQGrid library to create a data grid which has a drop down inside a cell. We want that on single click the drop down in the grid cell should be editable but drop down is opening on second click. How to avoid multiple clicks to open drop down in edit mode?
We tried below options but none of them worked. Please suggest some option as this is important for our application to have single click dropdown edit.

1. We used the PQGrid clickToEdit property and assigned 1 as value.

2. We also tried fixing with jQuery by binding click event on parent element like below:
$('.superparentclass').on('click','selectdropdowncontainerclass',function() {
$('.pq-editor-outer').find('select').trigger('click');});

We tried with 'change' and 'open' event too but did not work.

[paramvir]

Native browser select list can't be created and opened in a single click because there is no known way to programmatically open it.

It requires use of pqSelect component as editor to do so.

Please include pqSelect files in the document and add this code in column.editor.init callback.

Code: [Select]

      init: function (ui) {
        ui.$cell.find("select").pqSelect(); //first create it.
setTimeout(function(){
ui.$cell.find("select").pqSelect('open');// programmatically open the editor.
})
      },

And yes it also requires editModel.clicksToEdit: 1

Code: [Select]

editModel: {
    clicksToEdit:1,
    ... 
}


[applepqgrid]

Thanks for the reply.

I have tried the approach you have suggested by making the changes. The following function is not triggering:
 column.editor.init = function (ui) {
        ui.$cell.find("select").pqSelect();
   setTimeout(function(){
      ui.$cell.find("select").pqSelect('open');
   })                  
 }

The init function is not working. Can you suggest other approach for resolving the issue?

[paramvir]

editor.init is not triggering implies it's not implemented correctly.

Do you see any error in the browser developer console and how have you taken reference to the column.

editor.init callback is usually defined inline during initialization as in this example.

https://paramquery.com/pro/demos/editing_custom

"Shipping Via" column.

[applepqgrid]

We are able to integrate and the drop down is populating in single click. But while when we try to click on already selected option, nothing is happening even though the selection is preserved.This may cause confusion to the user since the drop down popup is not disappearing.

Please suggest me how I can fix the above problem.

Note : I can reproduce the same behavior in the demo link shared.

[paramvir]

this is the default behaviour and I'm afraid I don't see any option to configure that.

Normally user opens the select list to select other option but not the same one.

And popup is closed with click outside the popup or when escape key is pressed.