使用JQuery向JQGrid添加第二个工具栏 [英] Adding a second toolbar to JQGrid using JQuery

问题描述

是否有任何方法可以从JQueryUI向现有JQGrid添加第二个工具栏.

解决方案

您可以使用jqGrid的toolbar: [true, "bottom"]选项在网格底部添加其他工具栏.网格的ID将由't_'前缀和网格ID构成.您可以手动将任何信息添加到网格.例如，以下代码添加简单的 jQuery UI Button :

$('<div><span id="myToolbar" style="float: right;"></span></div>').appendTo("#t_" + $grid[0].id);
$('<button>', {title: 'Click me!'}).css({
    float: "right",
    height: "21px",
    width: "20px"
}).appendTo("#myToolbar").button({
            icons: {
                primary: "ui-icon-gear"
            },
            text: false
        }).click(function (e) {
            alert('My button was clicked');
        });

您可以在演示上看到结果:

(我将光标放在按钮上以显示工具提示点击我！")

Is there any way to add a second toolbar to existing JQGrid from JQueryUI.

解决方案

You can use toolbar: [true, "bottom"] option of jqGrid to add additional toolbar at the bottom of grid. The id of the grid will be constructed from 't_' prefix and the grid id. You can add any information to the grid manually. For example the following code add simple jQuery UI Button:

$('<div><span id="myToolbar" style="float: right;"></span></div>').appendTo("#t_" + $grid[0].id);
$('<button>', {title: 'Click me!'}).css({
    float: "right",
    height: "21px",
    width: "20px"
}).appendTo("#myToolbar").button({
            icons: {
                primary: "ui-icon-gear"
            },
            text: false
        }).click(function (e) {
            alert('My button was clicked');
        });

you can see the results on the demo:

(I placed the cursor over the button to show the tooltip "Click me!")

这篇关于使用JQuery向JQGrid添加第二个工具栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！