欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

JEECG 避免表单重复提交

程序员文章站 2022-05-29 23:09:16
...

JEECG项目,采用的是标签式开发,这个在一定的程度上面大大的方便我们进行二次开发。用于表单验证的插件是Validform V5.3.1。
表单验证对应的标签类:FormValidationTag.java
因此我们需要对这个类进行改造,使其能够避免表单的重复提交。针对目前JEECG项目当中的添加、编辑页面大部分采用的是Jquery UI当中的dialog插件。在表单验证通过,进行提交之前我们需要在页面的上方增加一个遮罩,用于防止表单的再次提交。因此我们在点击提交按钮之后,再次的弹出一个对话框,用于做遮罩使用。

首先,初始化一个对话框的引用,方便后面可以进行关闭遮罩。

sb.append("<script type=\"text/javascript\">")
//增加一个全局的js变量
sb.append("var subDlgIndex = null;");
sb.append("$(function(){");
...

初始化对话框:

/**
     * 增加显示加载图层
     * @param sb
     */
    private void submitLoading(StringBuffer sb) {
        sb.append("subDlgIndex = $.dialog({");
        sb.append("content: '正在加载中'");
        sb.append(",zIndex:19910320");
        sb.append(",lock:true");
        sb.append(",width:100");
        sb.append(",height:50");
        sb.append(",opacity:0.3");
        sb.append(",title:'提示'");
        sb.append(",cache:false");
        sb.append("");
        sb.append("});");
        //对话框显示出来之后,我们将其隐藏,使用一个加载gif图片
        sb.append("var infoTable = subDlgIndex.DOM.t.parent().parent().parent();");
        sb.append("infoTable.parent().append('<div id=\"infoTable-loading\" style=\"text-align:center;\"><img src=\"plug-in/layer/skin/default/loading-0.gif\"/></div>');");
        sb.append("infoTable.css('display','none');");
    }

对原有beforesubmit进行修订:

if (beforeSubmit != null) {
    sb.append("beforeSubmit:function(curform){var tag=false;");
    submitLoading(sb);
    sb.append("return " + beforeSubmit );
    if(beforeSubmit.indexOf("(") < 0){
        sb.append("(curform);");
    }
    sb.append("},");
}else{
    sb.append("beforeSubmit:function(curform){var tag=false;");
    submitLoading(sb);
    sb.append("},");
}

之后我们需要在callback当中将遮罩对话框关闭和隐藏加载图片:

sb.append("callback:function(data){");
sb.append("if(subDlgIndex && subDlgIndex != null){");
sb.append("$('#infoTable-loading').hide();");
sb.append("subDlgIndex.close();");
sb.append("}");
...

到这里基本的添加、编辑页面我们均已对其增加响应的加载效果
JEECG 避免表单重复提交
但是这边还会有一个问题就是在导入数据,上传文件的时候,这个对应的遮罩对话框不会关闭。
我们需要再对UploadTag.java进行修订,让其在上传完成的时候,判断是否存在遮罩对话框,存在的话将其关闭:

                "onQueueComplete : function(queueData) { ");
                if(dialog)
                {
                sb.append("var win = frameElement.api.opener;"        
                +"win.reloadTable();"
                +"win.tip(serverMsg);"
                //判断是否存在遮罩对话框
                +"if('undefined' != typeof subDlgIndex && subDlgIndex != null){"
                +"$('#infoTable-loading').hide();"
                +"subDlgIndex.close();"
                +"}"
                +"frameElement.api.close();");