Free jqGrid 4.8.0 - Add buttons to toolbar

Question

I learn there is an option to add a toolbar to the grid by adding toolbar:[true.'top'] (example for adding an empty toolbar to the top of the grid).

How do I add buttons to that toolbar? I know how jqGrid('navButtonAdd', nameOfPager) works and also familier with the toppager options, but don't know how to add buttons to the toolbar I just mentioned above.

Thanks,

Familist

Answer 1

jqGrid have no API for manipulation of the toolbar: [true, "top"]. The only goal of the toolbar is a <div> inside of jqGrid. The CSS width attribute will be changed during resizing the grid, but nothing more will be done.

The answer provides (see the demo) provides a practical example of the usage of the toolbar. It add information using $("#t_" + $.jgrid.jqID($grid[0].id)).append to the toolbar. In case if the grid id don't contains special characters (., , and other) one can use simplified selector "#t_" + $grid[0].id.

In the same way one can move the navigator buttons from the standard place to the top toolbar. It could be practical it you have many toolbar buttons. I created the demo for you which demonstrates this.

One can combine the solution with createContexMenuFromNavigatorButtons and showHideColumnMenu methods which I described in the answer

The approach is close to another answer where one wanted to have large button on top of the grid to make it more friendly for the users of Tablet PC (iPad for example).

There are exist the feature request with an example of adding functionality in the top toolbar. I find the idea interesting and I hope that I will find for the writing of the corresponding implementation.

Longueur