javascript - 在 JQGrid 中向标题栏添加多个图标

Question

我正在尝试向 JQGrid 中的 tilebar 添加多个图标。我使用某种破解的 JQuery 添加了 1，但我需要将它们并排放置在折叠按钮旁边。我的解决方案看起来很不优雅。

这是我添加了 1 个图标的代码(我需要 3 个图标，可能需要 4 个)

$("#grid").setCaption('Title Goes Here' + '<span style="margin-left:200px;"></span>' + '<input type="image" id="icon_test" src="img/pencil_icon.png" onclick="icon_test_click();" title="#" />');

Answer 1

这是我将按钮附加到我的 jqGrid 标题栏的示例:

    $('.ui-jqgrid-title').after('<div id="jqGridButtonDiv"><button id="Button1Id" type="button" class="titlebutton ui-button ui-widget ui-state-default ui-corner-all '+
                                'ui-button-text-only" role="button">Button Text</button></div>')
                        .after('<div id="YourCollectionFoilToggleDiv"><button id="Button2Id" type="button" class="titlebutton ui-button '+
                        'ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button">Button Text</button>  </div>');

然后使用一些 CSS 来设置它们向右浮动的样式，并带有一些填充。

#jqGridButtonDiv{float:right; padding-right:50px; position:relative; top:-1px;}

您应该能够轻松地调整它以将按钮更改为图标等。