jQuery: In jqGrid is it possible to reorder the to

Question

In jqGrid is it possible to reorder the default buttons in the footer toolbar? I'm trying to get the Search button to display before the Delete button. I've read the documentation and couldn't find any mention of it but thought there might be a simple trick.

Answer 1

Just wanted to extend the accepted answer by mentioning that the inlineNav buttons (as opposed to the navGrid buttons) have a different naming scheme for id, which is:

gridid + "_il" + "add", "edit", "save", "cancel"

so if gridid = #list, the selector for the inline add button would be $('#list_iladd')

Answer 2

There are no standard options which allows to reorder the buttons in the navigator toolbar. On the other side no part of jqGrid code is depend on the order, so you can reorder the buttons yourself.

To do this you should know that the ids of the buttons are build from the prefix "add_", "edit_", "del_", "search_", "refresh_", "view_" and the id of the grid. If the id of the grid is "list" then the code could be

$("#list").jqGrid("navGrid", "#pager");
$("#search_list").insertBefore("#del_list");

and it move the search button from it's standard place

to

In more common case, if you have variable $grid which represent $("#list"), the code will be

$grid.jqGrid('navGrid', '#pager');
var gridid = $.jgrid.jqID($grid[0].id);
$("#search_" + gridid).insertBefore("#del_" + gridid);

The function $.jgrid.jqID are needed only if the id of the grid could contain special meta-characters like !"#$%&'()*+,./:;<=>?@[\]^``{|}~ which must be escaped if there are used in the selectors (see here for more information).

The corresponding demo you will find here.