过滤器工具栏旁边的添加按钮 [英] adding button adjacent to filter toolbar

问题描述

按钮应与过滤器工具栏文本框完全在同一行，即在过滤器工具栏结束后，即我希望按钮与过滤器工具栏文本框完全在同一行. 我试过了，但是没有用

the button should be exactly in the same row as the filter toolbar text boxe exactly after the filter toolbar ends i.e. i want a button exatly in the same row as the filter toolbar text boxes. i tried this but it is not working

$('#gridTable').after("div.ui-jqgrid-view").find("div.ui-jqgrid-hdiv table.ui-jqgrid-htable tr.ui-search-toolbar").each(function () {
        $('<button>').css({ float: "right", height: "16px", width: "16px" }).appendTo(this).button({
            icons: { primary: "ui-icon-refresh" },
            text: false,
            title: "Clear Filters"
        }).click(function (e) {
            alert("hi");
                   });
    });

推荐答案

jqGrid当前在搜索工具栏中不支持stype: "custom"(仅在搜索"对话框中).因此，要在搜索工具栏中添加自定义元素(如按钮)，您必须执行以下操作.首先，需要在搜索工具栏中放置自定义元素.如果要在搜索工具栏的末尾具有按钮，则可以在网格中的最后一列中添加虚拟列(在colModel中):

jqGrid don't support currently stype: "custom" in searching toolbar (only in Searching Dialog). So to add custom element like button in the searching toolbar you have to do following. First of all one need to have place in the searching toolbar for the custom element. If you want to have button at the end of searching toolbar you can add dummy last column in the grid (in colModel):

{ name: 'sbutton', width: 20, fixed: true, search: false, sortable: false }

该定义会将空div放置在该列上方的搜索工具栏中.要将按钮放在div中，可以使用例如以下代码

The definition will place empty div inside of the searching toolbar over the column. To place button in the div one can use for example the following code

var $th = $($grid[0].grid.hDiv).find(".ui-jqgrid-htable>thead>.ui-search-toolbar>th:nth-child(" +
        $grid[0].grid.headers.length + ")");
$th.find(">div").append($("<button id='mySearch' style='margin-top:1px;height:20px;width:20px'></button>").button({
    text: false, icons: {primary: "ui-icon-search"}
}));

其中$grid的定义类似于var $grid = $("#gridId");.

该演示演示了该方法:

这篇关于过滤器工具栏旁边的添加按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！