将 jqGrid 自定义导航添加到顶部工具栏 [英] Adding jqGrid Custom Navigation to Top Toolbar

问题描述

是否可以将导航项添加到 jqGrid 中的顶部寻呼机"?如果是这样，这样做的语法是什么?

我的页面上有一个如下所示的 HTML 片段

<table id="mygrid"></表><div id="mygrid_pager"></div>

然后是一个看起来像这样的 jqGrid 初始化

$('#mygrid').jqGrid({...,//为简洁起见删除了完整的配置字符串，寻呼机:jQuery('#mygrid'),上页:真});$('#mygrid').jqGrid('navGrid', '#mygrid_pager'),{'添加':假，德尔":假，编辑":假，搜索":假，'刷新':假，'cloneToTop':真，}).navButtonAdd('',{...});//为简洁起见，为删除按钮配置 navbutton 字符串

ID 为 #mygrid_toppager 的顶部寻呼机"会自动插入到页面中，但其自定义按钮(显示在底部寻呼机上)不会随行.

我看到相应的演示..p>

Is it possible to add navigation items to the "top pager" in a jqGrid? And if so, what's the syntax for doing so?

I have an HTML snippet on my page that looks like this

<table id="mygrid">
</table>
<div id="mygrid_pager"></div>

And then an jqGrid initialization that looks something like this

$('#mygrid').jqGrid({
    ..., //full config string removed for brevity,
    pager:jQuery('#mygrid'),
    toppager:true
}); 
$('#mygrid').jqGrid('navGrid', '#mygrid_pager'),{
    'add':false,
    'del':false,
    'edit':false,
    'search':false,
    'refresh':false,
    'cloneToTop':true,  
}).navButtonAdd('',{...}); //config navbutton string for button removed for brevity

A "top pager" with the id of #mygrid_toppager is automatically inserted into the page, but its custom buttons (which appear on the bottom pager) don't come along for the ride.

I see that there's a "cloneToTop" option included for the navGrid, but its description seems confusing, and I can only assume I'm using it wrong.

Clones all the actions from the bottom pager to the top pager if defined. Note that the navGrid can be applied to the top pager only. The id of the top pager is a combination of grid id and "_toppager"

My understanding of the option is it will take buttons added to the bottom pager, and clone them to the top. However, the description then goes on to say "the navGrid can be applied to the top pager only, which doesn't make any sense since you're cloning it. The pont being, I clearly have a deep misunderstanding of how the API is supposed to be used.

If anyone can point me in the right direction (even just to a working example somewhere) I'd appreciate it. I'd prefer to do this through official APIs, as opposed to clever DOM manipulation, as seen elsewhere on StackOverflow.

解决方案

OK, it seems that I found a way which looks like better. The idea is to use navButtonAdd with the "#list_toppager_left" instead of "#pager".

I modified the old answer so, that one custom button are added on the top of the navigation toolbar together with one standard button. Other elements from the top navigation toolbar will be removed. The results will looks like

You can see the corresponding demo live here.

这篇关于将 jqGrid 自定义导航添加到顶部工具栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！