Question

对于那些使用jqGrid进行表单编辑的人来说非常简单，jqGrid覆盖使表单编辑对话框显示为modal正在使用＆＃39; .jqmOverlay＆＃39;而不是主题＆＃39; .ui-widget-overlay＆＃39;对于jquery。

我尝试在afterShowForm事件中删除jqmOverlay并将其替换为ui-widget-overlay，但正确的覆盖（ui-widget-overlay）会在它恢复为不正确的（jqmOverlay）之前出现一秒钟。 / p>

除非我弄错了，否则似乎没有任何后来发生的事件可以尝试解雇。

任何帮助都将不胜感激。

afterShowForm: function (form)
    {
        var overlayDiv = $('.jqmOverlay');
        overlayDiv.removeAttr('class');
        overlayDiv.attr('class', 'ui-widget-overlay');
        //$('.jqmOverlay').attr('class', 'ui-widget-overlay');                       

    }

Answer 1

The form editing支持两种不同的叠加层：标准'ui-widget-overlay'和jqModal.js的jqModal。

如果您不想使用jqModal插件，可以在添加或编辑设置选项列表中添加jqModal:false属性。如果叠加层将是以下内容：

<div style="display: block;" id="lui_list" class="ui-widget-overlay jqgrid-overlay"/>

（这里war使用了<table>元素具有id =“list”的网格）

如果要删除叠加层，可以隐藏

afterShowForm:function(){
    $("#lui_"+grid[0].id).hide(); // hide #lui_list overlay
}

其中grid定义为var grid=$("list");

更新：如果您愿意，可以像我之前描述的那样隐藏网格的叠加层，并创建自己的覆盖层，其中包含“ui-widget-overlay”类。我创建了the demo，它在我的测试中有效，没有你描述的问题。我使用了“编辑”对话框的以下选项：

recreateForm:true,
jqModal:false,
reloadAfterSubmit:false,
savekey: [true,13],
closeOnEscape:true,
closeAfterEdit:true,
afterShowForm:function(){
    $("#lui_"+grid[0].id).hide();
    $('body').prepend('<div class="ui-widget-overlay" id="My_list" style="left: 0px; top: 0px; width: 100%; height: 100%; position: fixed; z-index: 949; opacity: 0.3;"/>');
},
onClose:function(){
    $('#My_list').remove();
}

您可能应该更改opacity或z-index的值，以便在您的应用中更好地使用它。请注意z-index的设置。如果您需要增加它，您可能需要使用编辑属性的zIndex的附加值。

jqGrid - 表单编辑叠加与主题不同

1 个答案: