jqgrid searchGrid.overlay 使用事列

以下是一个使用 jqGrid 中 searchGrid.overlay 的示例：

// 创建 jqGrid 对象
$("#grid").jqGrid({
    url: "data.json",
    mtype: "GET",
    datatype: "json",
    colModel: [
        { name: "id", index: "id", width: 50 },
        { name: "name", index: "name", width: 200 },
        { name: "age", index: "age", width: 100 },
        { name: "address", index: "address", width: 300 }
    ],
    pager: "#pager",
    rowNum: 10,
    rowList: [10, 20, 30],
    viewrecords: true,
    caption: "Example jqGrid"
});

// 在搜索对话框中添加覆盖层
$("#grid").jqGrid("navGrid", "#pager", { search: true }, {}, {}, {}, {
    // 设置覆盖层的样式
    overlay: {
        backgroundColor: "#000",
        opacity: 0.5,
        zIndex: 1000
    },
    // 显示覆盖层
    beforeShowSearch: function () {
        $("#grid")[0].triggerToolbar();
        $("#searchmodfbox_" + $("#grid")[0].id).css({
            zIndex: 1001
        });
        $("#searchmodfbox_" + $("#grid")[0].id).show();
        $("#searchmodfbox_" + $("#grid")[0].id).prepend(searchGrid.overlay1);
        searchGrid.overlay1.show();
    },
    // 隐藏覆盖层
    onClose: function () {
        searchGrid.overlay1.hide();
    }
});

上述代码中，我们通过设置属性 searchGrid.overlay 来控制搜索对话框中的覆盖层的样式和行为。在 beforeShowSearch 回调函数中，我们使用 jQuery 将覆盖层元素添加到搜索对话框中，并设置其样式和显示。在 onClose 回调函数中，我们隐藏了搜索对话框中的覆盖层。