Author Topic: jquery autocomplete custom editor  (Read 9550 times)

Ron Hess

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 19
    • View Profile
jquery autocomplete custom editor
« on: October 04, 2013, 09:56:53 am »
I've constructed a custom editor using jquery.autocomplete(), it's mostly working as expected in the open-source version, but now in the Pro version, the down arrow key is not arriving at my plugin , it is getting sent / grabbed by the grid and moving me down a row. 

I like the feature to move down , except when my autocomplete pull down list is open, then i want to keep those keys for my navigation.

Is there a simple way to keep these keystrokes for my editor and not let them be snagged by pqGrid ?

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Re: jquery autocomplete custom editor
« Reply #1 on: October 04, 2013, 06:21:40 pm »
Ron

Could you please provide the relevant source code of your jqueryui autocomplete implementation which shows the mentioned issue.


Ron Hess

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 19
    • View Profile
Re: jquery autocomplete custom editor
« Reply #2 on: October 04, 2013, 08:02:19 pm »
here is the editor that works with ParamQuery open-source, only thing i'm missing is downArrow navigation within the widget, appears to be picked up by grid instead of the ui widget.

var lookupEditor = function ( ui ) {
        var $cell = ui.$cell.css('padding', '0'),
            data = ui.rowData,
            column = this.colModel[ui.colIndx];
           
          var $inp = $("<input type='text' style='padding:2px;border:0;vertical-align:bottom;width:96%;'/>")
            .attr('data-table', ui.dataIndx )
            .attr('data-sobjectid', data.Id)
            .appendTo($cell)
            .val( resolveLookupName(data,ui.dataIndx) ).select()
            .autocomplete({
               source:  function( request, response) {
                    var which = this.element.attr('data-table');
                    if ( which == null ) which ='';
                   
                    Visualforce.remoting.Manager.invokeAction(
                        '{!$RemoteAction.PQGridComp.lookupSearch}',
                        request.term,
                        which ,
                        function(result, event){
                            checkErrors( event);
                            cleanNS( result );
                            values = result;
                            response(values);
                        }
                    );
                },
                delay: 1,
                focus: function( event, ui ) {
                    $(this).val( ui.item.value);
                },
                select: function( event, ui ) {
                    var id = ui.item.id,
                        nam = ui.item.value,
                        sobject = findSobjectById( $(this).attr('data-sobjectid') ),
                  field = $(this).attr('data-table');
                          setLookupIdName( sobject, field, id, nam);
                },
                minLength:2
           });
    }

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Re: jquery autocomplete custom editor
« Reply #3 on: October 04, 2013, 08:40:06 pm »
Ron

How have you implemented the up / down key behaviour. Are you using cellEditKeyDown to filter the up/down keys?

or have you copied some code from a demo.

Do you see keyUpDown: true in editModel in your code.

« Last Edit: October 04, 2013, 08:51:58 pm by paramquery »

Ron Hess

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 19
    • View Profile
Re: jquery autocomplete custom editor
« Reply #4 on: October 04, 2013, 08:53:37 pm »
I did not do any special up / down key handling , just the default that the autocomplete widget adds, which navigates the autocomplete menu.

i am not using cellEditKeyDown, from the description this may allow me to avoid the grid's use of these keys if the autocomplete want's to own that event.  I'll try this next.

thanks

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Re: jquery autocomplete custom editor
« Reply #5 on: October 04, 2013, 09:14:52 pm »
Ron

By default the grid doesn't capture up/down keys unless it's told to do so. From the description you have provided in your first message

"it is getting sent / grabbed by the grid and moving me down a row.  "

it looks like there has been either cellEditKeyDown listener ( to modify up/down key behaviour) or

editModel:  { keyUpDown : true } in your code.

Could you please look for these 2 things or send the code of the grid implementation for review.









« Last Edit: October 04, 2013, 09:16:32 pm by paramquery »

Ron Hess

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 19
    • View Profile
Re: jquery autocomplete custom editor
« Reply #6 on: October 06, 2013, 11:44:31 pm »
Yes, i did have editModel:  { keyUpDown : true }, and i actually want that to work , so i'm leaving this true

i now have cellEditKeyDown implemented and this allows me to skip the keyUpDown grid nav feature when i need to for jquery UI widget.

thanks