jqGrid navGrid search submit on Enter keypress not

Question

I'd like to be able to invoke the find button on the search dialog when the "Enter/Return" key is pressed. Unfortunately the 'savekey' option doesn't submit the form and the same way it does in the edit and add Form Editing.

Here's a snippet of the code I'm using.

$("#list").jqGrid('navGrid', '#pager', 
    {edit: true, add: true, del: true, search: true, view: true},

    ...

    {
        caption: "Search",
        closeAfterSearch: true,
        closeOnEscape: true,
        sopt: ['cn','eq'],
        savekey: [true, 13] 
    },

Here's a link to the form_editing documentation I've consulted:

http://www.trirand.com/jqgridwiki/doku.php?id=wiki:form_editing&s[]=savekey

Here's a link to the Single field searching documentation:

http://www.trirand.com/jqgridwiki/doku.php?id=wiki:singe_searching&s[]=navgrid

I can't find anything to suggest this feature exists but I seems like a no-brainer. As always, any help or direction is greatly appreciated.

Answer 1

I had the same problem on FireFox but the above solution worked fine in IE. In order to make it work on Firefox I had to use the focus function instead of click as below:

beforeShowSearch: function (form) {
                        form.keydown(function (e) {
                            if (e.which == 13) {
                                $("#fbox_list_search").focus();
                            }
                        });
                    },

Answer 2

This was pretty helpful, but I'm the provided solution isn't quite working for me. I tweaked the code provided and it somewhat works now, but it doesn't appear to be submitting the correct data. Whenever I press the enter key, it submits a "0" in the input box instead of whatever I've actually put in there. For whatever reason it is not posting the searchString. The code I'm using is:

beforeShowSearch: function(form){
  $(form).keydown(function(e) {
    if (e.keyCode == 13) {
      $("#fbox_cust_grid_search").click();
    }
  });
},
onClose: function(form){
  $(form).unbind('keydown');
}

Do any of you guys have a suggestion as to what might be going on here?

Edit: Interesting, when I alert something out(anything) right before the .click() method, the data is posted perfectly. Any ideas?

Answer 3

Try the following code. Works for me:

beforeShowSearch: function(form){
   $(form).keydown(function(e) {
      if (e.keyCode == 13) {
         setTimeout(function() {
            $("#fbox_cust_grid_search").click();
         }, 200);
      }
   });
   return true;
},
onClose: function(form){
   $("#fbox_cust_grid_search").unbind('keydown');
}

There seems to be an issue when the click method is called too quickly. Giving the grid 200ms to do what it has to do before searching seems to do the trick.

Answer 4

It seems to me that the problem cam be solved if you replace savekey: [true, 13] option which really not work for searching to the following beforeShowSearch and onClose event handle

beforeShowSearch: function(form){
    form.keydown(function(e) {
        if (e.which == 13) {
            $(".ui-search", form).click();
        }
    });
},
onClose: function(form){
    form.unbind('keydown');
}

This method will work not only for the single field searching but for advance searching also.

If you want that the 'Enter' key work only in the input fields you can replace form.keydown to $('.vdata',form).keydown and make the corresponding changes in the unbind.