jQuery MiniUI

标题: document.forms.form1.submit()后台处理数据没有完成时 [打印本页]

作者: 18907877465 时间: 2014-7-10 15:43:24 标题: document.forms.form1.submit()后台处理数据没有完成时

本帖最后由 18907877465 于 2014-7-10 15:45 编辑

document.forms.form1.submit()，后台处理没有完成时显示掩盖页面“提交中....”,后台处理完成时则关闭掩盖页面。这个能实现吗？
mini.mask({ el: document.body, cls: 'mini-mask-loading', html: '加载中...' });
document.forms.form1.submit();

作者: felt 时间: 2014-7-10 16:05:35

你后台提交完输出一段js试试

作者: 18907877465 时间: 2014-7-10 16:18:27

felt 发表于 2014-7-10 16:05
你后台提交完输出一段js试试

我调用的地址是这样的：../data/AjaxDown.jsp?method=GetDown;跟data其他的jsp一样，那么在GetDown方法执行结束前应该做什么操作，使得页面知道该方法执行完成了，并且关闭mini.mask()。

作者: factory 时间: 2014-7-10 16:47:21

18907877465 发表于 2014-7-10 16:18
我调用的地址是这样的：../data/AjaxDown.jsp?method=GetDown;跟data其他的jsp一样，那么在GetDown方法执 ...

传统表单提交的方式是把页面刷新的

作者: 18907877465 时间: 2014-7-10 17:15:46

factory 发表于 2014-7-10 16:47
传统表单提交的方式是把页面刷新的

如果是刷新的话，就达不到我想要的效果了

作者: felt 时间: 2014-7-10 17:20:54

18907877465 发表于 2014-7-10 17:15
如果是刷新的话，就达不到我想要的效果了

那你用我们例子里的提交方法
ajax提交，你看下试用包里form的例子
这个可以在ajax回调里处理的

作者: 18907877465 时间: 2014-7-10 17:36:11

felt 发表于 2014-7-10 17:20
那你用我们例子里的提交方法
ajax提交，你看下试用包里form的例子
这个可以在ajax回调里处理的 ...

form如下：

<form id="form1" name="form1" action="../data/AjaxDown.jsp?method=GetDown" method="post">
   <input name="id" class="mini-hidden" />
      <div style="padding-left:11px;padding-bottom:5px;">
         <table style="table-layout:fixed;">
            <tr>
                  <td style="width:70px;">选择项目：</td>
                  <td style="width:150px;">
                     <input name="project_id" class="mini-combobox" valueField="project_id" textField="project_name"
                        url="../data/AjaxProject.jsp?method=GetDepartments"
                        onvaluechanged="onDeptChanged" required="true"
                           emptyText="请选择项目"
                        />
                  </td>
            </tr>
            <tr>
                  <td style="width:70px;">选择物资：</td>
                  <td style="width:150px;">
                     <input name="material_id" class="mini-combobox" valueField="material_id" textField="material_name"
                        url="../data/AjaxProject.jsp?method=GetDepartments2"
                        onvaluechanged="onDeptChanged" required="true"
                           emptyText="请选择物资"
                        />
                  </td>
            </tr>
            <tr>
            <td >导出模板：</td>
            <td colspan="3">
               <a class="mini-button" iconCls="icon-download" onclick="down()">导出模板</a>
            </td>
            </tr>
            </table>
         </div>
         </form>

javascript如下

//下载模板
      function down(e) {
         down2();
      }
      //下载模板
      function down2(){
         //检查是否已选上
         var o = form.getData();

         form.validate();
         if (form.isValid() == false) return;

         var deptCombo = mini.getbyName("project_id");
         var positionCombo = mini.getbyName("position");
         var project_id = deptCombo.getValue();
         var deptCombo2 = mini.getbyName("material_id");
         var material_id = deptCombo2.getValue();
   /* $.ajax({
            url: "../data/AjaxDown.jsp?method=GetDown&project_id="+project_id+"&material_id="+material_id,
            success: function (text) {

                  var o = mini.decode(text);
                  form.setData(o);

                  grid.unmask();
            }
            }); */
         //如果使用$.ajax不弹出下载页面
         mini.mask({ el: document.body, cls: 'mini-mask-loading', html: '加载中...'});
      window.location.href="../data/AjaxDown.jsp?
                                          method=GetDown&project_id="+project_id+"&material_id="+material_id;
         //使用window.location.href则一直显示加载中


         /* document.forms.form1.submit(); */
         //mini.unmask();
         out.clear();

         out=pageContext.pushBody();

      }

作者: felt 时间: 2014-7-11 09:39:48

18907877465 发表于 2014-7-10 17:36
form如下：

做个重现的html例子，回复的高级模式打包上来
你这代码看不懂，一会grid.unmask,一会mini.mask

作者: 18907877465 时间: 2014-7-11 10:53:36

felt 发表于 2014-7-11 09:39
做个重现的html例子，回复的高级模式打包上来
你这代码看不懂，一会grid.unmask,一会mini.mask ...

我想达到的效果是 document.forms.form1.submit();提交给后台处理完成后关闭mini.mask。
但是找不到解决方法，已经这样解决了，虽然达不到实际的效果，但没有好的办法，只能这样将就先用了：
            document.forms.form1.submit();
            mini.mask({ el: document.body, cls: 'mini-mask-loading', html: '加载中,请稍后...'});
            setTimeout(function () {
            mini.unmask(document.body);
            }, 5000);

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)