Layui学习中遇到的问题

1."layui-form"提交数据问题

  <form class="layui-form" lay-filter="add_form" action="" th:action="@{/system/login}" method="post">  
            <div class="layui-form-item">
                    <label class="layui-icon layui-icon-username" for="username"></label>
                    <input type="text" name="username" lay-verify="required|account" placeholder="账号" autocomplete="off" class="layui-input" >           
                </div>
                <div class="layui-form-item">
                    <label class="layui-icon layui-icon-password" for="password"></label>
                    <input type="password" name="password" lay-verify="required|password" placeholder="密码" autocomplete="off" class="layui-input" >          
                </div>
                <div class="layui-form-item">
                    <button   class="layui-btn layui-btn-fluid" lay-submit="" lay-filter="login">登 入</button>
                </div>
            </form>

当 return返回false时不提交数据,返回true才提交

  // 进行登录操作
        form.on('submit(login)', function (data) {
            data = data.field;
            if (data.username == '') {
                layer.msg('用户名不能为空');
                return false;
            }        
        
            return true;//false不能提交
        });

2.给"layui-form"中标签动态赋值

$().val()无法赋值

 form.val("add_form",{
                "username":"你的值",
                "password":"你的值"
            })

3.父窗口传值给子窗口

父页面

   <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>




  //设置全局变量json,用于接受表格的行信息
    var json;
   
 layui.use(['form', 'table'], function () {
 //省略其他
		
		//监听表格按钮
        table.on('tool(currentTableFilter)', function (obj) {
            var data = obj.data;
            if (obj.event === 'edit') {
                //这行是监听到的表格行数据信息,复制给json全局变量。
                json = JSON.stringify(data);
                var index = layer.open({
                    title: '编辑用户',
                    type: 2,
                    shade: 0.2,
                    maxmin:true,
                    shadeClose: true,
                    area: ['100%', '100%'],
                    content: '[[@{/}]]system/toPage?page=user/add',
                });
                $(window).on("resize", function () {
                    layer.full(index);
                });
                return false;
            } else if (obj.event === 'delete') {
              
            }
        });

 }
               

子窗口

 //从父层获取值,json是父层的全局js变量。eval是将该string类型的json串变为标准的json串
        var parent_json = eval('('+parent.json+')');
        console.log(parent_json);

4.动态选中radio和select

 <div class="layui-form-item">
        <label class="layui-form-label required">性别</label>
        <div class="layui-input-block">
            <input type="radio" name="sex" value="男" title="男" >
            <input type="radio" name="sex" value="女" title="女">
        </div>
    </div>
 <div class="layui-form-item">
        <label class="layui-form-label">权限等级</label>
        <div class="layui-input-block">
            <select name="scale" id="scale" lay-filter="aihao">
                <option value=""></option>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
            </select>
        </div>
    </div>

需要添加form.render()渲染页面

     	$("[name='sex'][value="+parent_json.sex+"]").prop("checked", "checked");
		$("#cId").val(parent_json.cId);
		$("#scale").val(parent_json.scale);
    	form.render();//渲染页面不加无法选中单选
发布了15 篇原创文章 · 获赞 2 · 访问量 1049

猜你喜欢

转载自blog.csdn.net/weixin_42408648/article/details/104077476
今日推荐