第一步,先把html考到页面底部,好吧。
- <!-- 编辑的内容 -->
- <div id="bjnr" style="display: none;">
- <form class="layui-form" action="" id="saveupdateform">
- <input id="isNew" name="isNew" type="hidden"/>
- <table class="layui-table layui-xs" lay-skin="nob">
- <tbody>
- <colgroup>
- <col width="80">
- <col>
- <col width="70">
- <col>
- </colgroup>
- <tr>
- <td align="right" class="bianjibd"><span class="necessary">*</span>用户帐号</td>
- <td>
- <input type="text" id="yhdh" name="yhdh" lay-verify="required" autocomplete="off" class="layui-input" readonly="true">
- </td>
- <td align="right" class="bianjibd"><span class="necessary">*</span>用户姓名</td>
- <td>
- <input type="text" id="xm" name="xm" lay-verify="required" autocomplete="off" class="layui-input">
- </td>
- </tr>
- <tr>
- <td align="right" class="bianjibd"><span class="necessary">*</span>登录密码</td>
- <td>
- <input type="password" id="mm" name="mm" lay-verify="required" autocomplete="off" class="layui-input">
- </td>
- <td align="right" class="bianjibd"><span class="necessary">*</span>角色类型</td>
- <td>
- <select name="rid" lay-filter="bigarea" id="rid">
- <option value="">请选择</option>
- </select>
- </td>
- </tr>
- <tr>
- <td align="right" class="bianjibd">身份证号</td>
- <td>
- <input type="text" id="sfzmhm" lay-verify="identity" name="sfzmhm" autocomplete="off" class="layui-input">
- </td>
- <td align="right" class="bianjibd">帐号状态</td>
- <td>
- <select name="zt" lay-filter="zhzhuang" id="zt">
- <option value="">请选择角色状态</option>
- <option value="1">启用</option>
- <option value="2">锁定</option>
- <option value="3">停用</option>
- </select>
- </td>
- </tr>
- <tr>
- <td align="right" class="bianjibd">帐号期限</td>
- <td>
- <input type="text" id="zhyxqStr" name="zhyxqStr" class="layui-input">
- </td>
- <td align="right" class="bianjibd">密码期限</td>
- <td>
- <input type="text" id="mmyxqStr" name="mmyxqStr" class="layui-input">
- </td>
- </tr>
- <tr>
- <td align="right" class="bianjibd">所属部门</td>
- <td>
- <select name="glbm" lay-filter="glbms" id="glbm">
- <option value="">请选择</option>
- </select>
- </td>
- <td align="right" class="bianjibd"></td>
- <td>
- </td>
- </tr>
- </tbody>
- </table>
- <div class="layui-input-block" style="display:none">
- <button class="layui-btn tj" lay-submit="" lay-filter="tjbtn">立即提交</button>
- </div>
- </form>
- </div>
第二步,js
- function addtk(isNew){
- $("#isNew").val(isNew);//这个是为了判断是编辑还是添加,不需要的可以删掉
- debugger;
- //弹出框开始
- var _funbtnxs = {
- yesxs1: function(index,layero){
- //单击提交的回调
- var mm = $("#mm").val();
- $("#mm").val(mm == "" ? undefined : hex_md5(mm));
- //绑定提交事件到弹出框的提交按钮
- $('.tj').click();
- }
- ,xs2: function(index,layero){
- //单击取消的回调
- layer.close(index);
- },success:function(layero){
- //弹出前回调
- layui.use(['form'], function(){
- var form = layui.form;
- //各种基于事件的操作,下面会有进一步介绍
- form.on('submit(tjbtn)', function(data){
- ajaxSubmitForm('saveupdateform','/save_or_update_user');
- //return false; //阻止表单跳转。如果需要表单跳转,去掉这段即可。
- });
- });
- }}
- tk("编辑",['600px', '350px'],'userbj',$("#bjnr"),['确定', '取消'],_funbtnxs);
- //弹出框结束
- }
- //弹出框 _title抬头标题,_area_arr弹出框宽高数组,_id唯一性,_content弹出框内容,_btn_arr按钮数组,_funbtnxs点击按钮对象函数
- function tk(_title,_area_arr,_id,_content,_btn_arr,_funbtnxs){
- layer.open({
- type: 1
- ,title: _title//标题
- ,area: _area_arr//['600px', '450px']
- ,shade: 0.1
- ,id: _id //设定一个id,防止重复弹出'LAY_layuipro'
- ,btn: _btn_arr//['确定', '取消']
- ,btnAlign: 'r'
- ,moveType: 1 //拖拽模式,0或者1
- ,content:_content //html内容
- ,yes:_funbtnxs.yesxs1
- ,btn2:_funbtnxs.xs2
- ,success:_funbtnxs.success
- });
- }