之前将事件提交到自定义 jqgrid 自定义表单上的按钮不起作用



我正在使用jqgrid 4.5.2版本与jquery-3.2.1。

在JQGrid中,实现了"添加"按钮(添加,编辑和删除)自定义(添加,编辑和删除)按钮。现在,单击自定义添加/编辑按钮打开自定义表单。以下是自定义按钮的onclick事件。

这意味着我们用自己的自定义表单替换了JQGrid默认编辑/添加表单。早些时候,我们通过Beforesubmit事件编写了一些验证,这些验证与JQGrid的默认(add/Edit)形式正常。现在,我想对替换的自定义表格应用相同的验证。

function(myGrid){
  myGrid.getGridParam('dataGrid').openEditFormIndicator();
}(myGrid)

该自定义表单具有自定义提交和取消按钮。现在,我想将BeforeSubmit事件添加到此提交按钮中。由于表单是自定义的,因此jqgrids默认beforesubmit事件不起作用。

添加/编辑表单是由我们自己的框架构建的,该框架是在Java上构建的。这些表格完全独立于JQGrid。我只是从JQGrid Row中获取ID(双击或单击编辑按钮),然后将其传递到模板,该模板从DB中拉出数据并形成行编辑表单。如果传递的ID是空的或在DB上找不到的,则使用相同的模板形成一个空的(添加)表单。

DataGrid.prototype.openEditFormIndicator = function() {
var id = this.grid.getGridParam('selrow')
if(!id) {
    var gridId = this.grid.attr('id');
    var idSelector = "#alertmod_" + gridId;
    $.jgrid.viewModal(idSelector, {
        gbox: "#gbox_" + $.jgrid.jqID(gridId),
        jqm: true
    });
    $(idSelector).find(".ui-jqdialog-titlebar-close").focus();
}
else {
    //openInteractiveForm('form_plugin_examples',this.options.formIndicatorId,'id',id,'true'); 
    var encodedPkId = encodeURIComponent(id);
    this.openFormIndicator('Id:' + encodedPkId + ',pkId:' + encodedPkId + ',Search:id%3A' + encodedPkId + ',IndicatorId:' + this.options.formIndicatorId + ',Debug:true' + ',FilterField:id,FilterValue:' + encodedPkId);
    // TODO width, length, position
}
};
DataGrid.prototype.openFormIndicator = function(optionsStr) {
  DialogBoxEdit.newWindow(this.options.formIndicatorId, optionsStr);
};

使用上述两个函数,添加/编辑表单是在Dialogboxedithandler.js中形成的。JS内部调用一个模板以创建表单。

创建的表单包含以下两个按钮,我需要添加beforeSubmit事件。

<Button id="lnk-close" onclick="closeDialogBoxControl($(this).closest('form'));" class="btn-default">Close</Button>
<Button id="lnk-submit" onclick="save_form_data($(this).closest('form'),true,'72');MD.ui.reloadGrid();"  class="btn-primary ui-dialog-close">Save</Button>

看来您第二次将这个问题放在其中。此处的文档在这里

基本上,在这种情况下,您需要定义该事件并返回适当的数组。使用链接中提供的帮助时,您可以单击onclick事件中定义的自定义按钮,可以做到这一点:

...
jQuery("#grid_id").jqGrid('editGridRow', rowid, {
    ...
    beforeSubmit : function( postdata, formid ) {
        if(someconditionOK) {
            return [true,''];
        } else {
            return [false,'Error submiting data'];
        }
    },
    ...
});

如果我们想使用beforeSubmit事件,我们必须在形式编辑中使用构建 - 在所有其他情况下,该事件都无法正常工作 - 简单的单词,我们需要编写自己的自定义,然后再提交,以防万一使用我们自己的编辑表格。

最新更新