将按钮添加到jqGrid顶部工具栏
看起来jqGrid的默认工具栏始终位于底部。 像Next / Prev页面这样的按钮和用于选择每页行数的下拉列表将始终显示在网格的底部。
我找到了一种方法来添加自定义顶部工具栏并将自定义按钮推入其中。
真正需要的是一种将默认function（如分页）添加到网格顶部而非底部的方法。
我不明白为什么拥有顶部工具栏这么重要。 你没有使用分页或网格中有很多行，没有滚动就看不到底部工具栏？ 还是有另一个原因？
jqGrid有boolean toppager参数（请参阅网格的设置选项 ）以创建额外的top pager。 您可以显示工具栏查看工具栏参数，但我不确定您使用与jqGrid相同的术语。 查看jqGrid演示的演示 （展开“3.1版中的新function”）。 可能你的意思是导航栏？
通常，jqGrid将显示HTML片段并将所有预定义的div元素分开。 导航栏将放在div中，id =“pg_pager”和class =“ui-pager-control”。 你可以使用jQuery操作jqGrid，例如在另一个地方移动这个div。 如果实现此类移动，则应每次在gridComplete事件句柄内（或在触发另一个完成事件之后）重做此操作。
编辑：很容易将现有的HTML片段移动到另一个地方jQuery('#element_to_be_moved').insertAfter('#existing_element')或jQuery('#element_to_be_moved').insertBefore('#existing_element') 。 在jqGrid页脚单元格中“从主网格中的单元格inheritance”CSS我描述了一些重要div的名称，这些div是jqGrid的一部分。 祝你在编码方面取得很大成功。
要使网格顶部的工具栏具有与底部工具栏相同的按钮和事件，您必须激活toppager:true到网格的定义并在定义后添加下一行
/** Duplicating the Nav Toolbar in top **/ var toolbarClone = $('#pager_left').clone(true); // Assuming that your grid's ID is myGrid $('#myGrid_toppager_left').prepend(toolbarClone);
这些线路将成功:)
请享用：
$('#datagridnav').insertBefore('#t_datagrid'); //relocate footer to top
我升级到jqgrid 3.7.2，希望它的toppager参数会有所帮助。 虽然它确实将分页控件放在顶部，但搜索按钮并没有出现。
// assuming a jqgrid with id='the_grid' $('#the_grid_pager_left').clone(true).insertBefore('#the_grid_toppager_center')
以上，通过一些小的CSS调整，将搜索/刷新按钮复制到toppager中，并保留他们的事件/行为。