如何在 jqgrid 中自定义页眉和页脚？答案

【问题标题】：How do I customize header and footer in jqgrid?如何在 jqgrid 中自定义页眉和页脚？
【发布时间】：2011-12-27 17:05:08
【问题描述】：

我在 jqgrid 的页眉和页脚中放置了几个按钮。有什么方法可以自定义吗？

我在这个链接的 jqgrid 中做了 footerData 选项：

但是我认为它是不同的和无关的。如果我错了，请告诉我。

谢谢。

【问题讨论】：

您不能使用 jqgrind API 方法自定义页眉和页脚。尝试使用 css 自定义自己。
如果您阅读页眉和页脚，您可能使用了错误的术语。看the page中间的图片。您将看到：标题（标题栏）、顶部工具栏、顶部分页器、列标题、搜索工具栏、网格体、页脚（摘要）行、底部工具栏和底部分页器。您想在哪里进行定制以及需要哪种定制？
@Oleg：对。这是错误的术语。根据术语，我想在导航层上放几个按钮。我想放置“立即购买”等按钮。

【解决方案1】：

要在导航栏中添加自定义按钮，您可以使用navButtonAdd 方法。它应该在创建导航栏后使用。导航器是寻呼机的一部分，它可以位于网格的底部、网格的顶部或两者兼有。

如果您更喜欢顶部寻呼机，您应该只使用 toppager: true 选项 jq网格。它为寻呼机本身创建 div。 toppager 的 id 将由网格 id （如“list”）和后缀“_toppager”构成（详见here）。

如果要使用底部分页器，则应在页面的 HTML 标记中定义分页器 div，例如 id="pager" 的空 div 并使用 jqGrid 的 pager 参数：pager: "#pager"。

要在寻呼机中创建导航栏，您应该调用navGrid 方法。作为 navigator 的第一个（pager）参数，您应该使用应该在其中创建导航栏的寻呼机的 id。例如

$("#list").jqGrid('navGrid', '#list_toppager',
    {add: false, edit: false, del: false, search: false, refresh: false});

在首页页面中创建空导航器（没有任何标准按钮）或

$("#list").jqGrid('navGrid', '#pager',
    {add: false, edit: false, del: false, search: false, refresh: false});

用 id="pager" 创建底部寻呼机的空导航器。如果您想同时创建顶部和底部寻呼机，您可以使用cloneToTop: true:

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

如果您使用一些标准按钮创建导航栏，您可以在顶部和底部导航栏之间移动按钮（请参阅here）。

导航栏存在后，您应该调用navButtonAdd 在寻呼机指定的导航栏上添加按钮（请参阅here）。要在onClickButton 回调中获取选定行的rowid，您应该使用jqGrid 的selrow 参数（请参阅here）。

【讨论】：