openDialog()中确定按钮点击事件

openDialog()中确定按钮点击事件

本文是我在开发过程中,遇到的也是我不知道的知识,所以此篇仅当做自己以后借鉴用的,如果能对看官你也有用,荣幸之至。

form.ajaxSubmit

首先,在jeeplus中xxxform.jsp文件中,一般openDialog()点击事件为form.submit().看代码

    function doSubmit(){//回调函数,在编辑和保存动作时,供openDialog调用提交表单。
          if(validateForm.form()){
              $("#inputForm").submit();
              return true;
          }

当你点击确定调用controller执行了某些操作时,在jeeplus中会返回前端一些信息,比如“修改成功”等,然后在表格上边显示,但是如果我采用另一种形式展现表格,这种方法就不适用了。
这里写图片描述
当打开该功能时,首先出现的是一个input和button,也就是查询条件和查询按钮,下面的表格,在开始时是不显示的,只有查询的内容满足一定的条件时,controller会返回一个true,表格才会显示。

代码块

   <c:if test="${exist==true }">
<body class="gray-bg">
    <div class="wrapper wrapper-content">
    <div class="ibox">

    <div class="ibox-content">
    <sys:message content="${redirectAttributes}"/>

    <!-- 表格 -->
    <table id="contentTable" class="table table-striped table-bordered table-hover table-condensed dataTables-example dataTable">
        <thead>
            <tr>
                <th  class="sort-column workteamName">班组名称</th>
                <th  class="sort-column wlId">生产线编号</th>
                <th  class="sort-column goodsId">产品编号</th>
                <th  class="sort-column teamNums">每天工作数量</th>
                <th  class="sort-column teamId">班组编号</th>
                <th  class="sort-column startDate">开始时间</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
        <c:forEach items="${page.list}" var="blPlanTeam">
            <tr>
                <%-- <td><a  href="#" onclick="openDialogView('查看bl_sfc_step', '${ctx}/plan/blPlanTeam/form?id=${blPlanTeam.id}','800px', '500px')">
                ${blPlanTeam.id}
                </a></td> --%>
                <td>
                    ${blPlanTeam.workteamName}
                </td>
                <td>
                    ${blPlanTeam.wlId}
                </td>
                <td>
                    ${blPlanTeam.goodsId}
                </td>
                <td>
                    ${blPlanTeam.teamNums}
                </td>
                <td>
                    ${blPlanTeam.teamId}
                </td>
                <td>
                    <fmt:formatDate value="${blPlanTeam.startDate}" pattern="yyyy-MM-dd"/>
                </td>
                <td>
                    <shiro:hasPermission name="plan:blPlanTeam:view">
                        <a href="#" onclick="openDialogView('查看生产计划单表', '${ctx}/plan/blPlanTeam/form?id=${blPlanTeam.id}','800px', '500px')" class="btn btn-info btn-xs" ><i class="fa fa-search-plus"></i> 查看</a>
                    </shiro:hasPermission>
                    <shiro:hasPermission name="plan:blPlanTeam:edit">
                        <a href="#" onclick="openDialog('修改生产计划单表', '${ctx}/plan/blPlanTeam/form?id=${blPlanTeam.id}','800px', '500px')" class="btn btn-success btn-xs" ><i class="fa fa-edit"></i> 修改</a>
                    </shiro:hasPermission>
                </td>
            </tr>
        </c:forEach>
        </tbody>
    </table>

        <!-- 分页代码 -->
    <table:page page="${page}"></table:page>
    <br/>
    <br/>
    </div>
    </div>
</div>
</body>
</c:if>

现在进入正题,上面我已经说明openDialog()按钮的点击事件为onSubmit所以如果我们想要完成操作时,提示信息,就可以在onSubmit中form.ajaxSubmit({…});

 function doSubmit(){//回调函数,在编辑和保存动作时,供openDialog调用提交表单。
              $("#inputForm").ajaxSubmit({// 验证新增是否成功
                     type : "post",
                     dataType : "json",
                     success : function(data) {
                         var rs = data;
                         if (rs.result) {                                  
                                 layer.alert("修改成功,是否关闭窗口?", {
                                     skin: 'layui-layer-molv' //样式类名  自定义样式
                                     ,closeBtn: 1    // 是否显示关闭按钮
                                     ,anim: 1 //动画类型
                                     ,btn: ['关闭'] //按钮
                                     ,icon: 6    // icon
                                     ,yes:function(){
                                             window.parent.location.reload(); //刷新父页面
                                             var index = parent.layer.getFrameIndex(window.name);
                                             parent.layer.close(index);//关闭自身页面
                                         return false;
                                     }});
                              $(this).resetForm();
                         } else {
                             layer.msg("下达失败", {
                                 icon : 5,
                                 shift : 6
                             });
                         }
                     }
                 });
        } 

效果如下:
这里写图片描述
但是有一个问题存在就是,在我ajaxSubmit中,当成功时,我是刷新页面的,但是有的需求是不允许那样做的,所以如果碰到,请自行更改代码。

离线写博客

本文为本人根据自己开发碰到的问题所写,因为个人认为对于保存而言本篇要比之前我写的文章更加合适所以特此写出来,给大家分享,也许有所不足,真诚的希望,有大牛能帮我纠正一下,我的错误,互相提高,以便以为可以分享更好的代码和技术给大家,携手在研发的道路上一去不复返。

猜你喜欢

转载自blog.csdn.net/weixin_42803027/article/details/82737334
今日推荐