Question

我正在尝试在jqGrid编辑对话框中包含ptTimeSelect小部件。以下代码片段是我尝试实现此目的的方式。

    $('#classTable').jqGrid('navGrid', '#classPager',
    {
        edit: true,
        add: true,
        del: true,
        search: false,
        refresh: false,
        view: true,
        position: "left",
        cloneToTop: false,
        edittitle: "Edit Selected Class",
        addtitle: "Add a Class",
        deltitle: "Delete Selected Class"
    },
    // Options for the edit dialog
    {
        editCaption: "Edit Class",
        closeAfterEdit: true,
        recreateForm: true,
        width: 400,
        onInitializeForm: function(form) {
            $("#startTime",form).ptTimeSelect();
            //$("#startTime",form).timepicker();
        }
    },

当我选择字段时，ptTimeSelect小部件会发布，但我无法与之交互。它在编辑对话框后面发布并显示为灰色。如果我使用timepicker小部件（上面评论过），它会正确发布并按预期工作，但我更喜欢ptTimeSelect小部件。

建议？

Answer 1

这是由ptTimeSelect具有低（10）默认z-index，并且jqGrid编辑对话框具有相当高的一个（950）引起的。解决方案是将ptTimeSelect的z-index设置得更高。

$('#classTable').jqGrid('navGrid', '#classPager',
{
    edit: true,
    add: true,
    del: true,
    search: false,
    refresh: false,
    view: true,
    position: "left",
    cloneToTop: false,
    edittitle: "Edit Selected Class",
    addtitle: "Add a Class",
    deltitle: "Delete Selected Class"
},
// Options for the edit dialog
{
    editCaption: "Edit Class",
    closeAfterEdit: true,
    recreateForm: true,
    width: 400,
    onInitializeForm: function(form) {
        $("#startTime",form).ptTimeSelect({zIndex: 975});
        //$("#startTime",form).timepicker();
    }
},

使用ptTimeSelect与jqGrid编辑对话框时遇到问题

1 个答案: