Jiang_Dao
Jiang_Dao
2019-11-22 09:46

layui的弹出层中我加了一个日期选择器,但是不好使,一闪而过 添加了trigger: 'click',也不行

  • javascript

<!DOCTYPE html>

<head>
    <link rel="stylesheet" href="layui/css/layui.css" media="all">

</head>
<body>

    <a class="layui-btn" id="test" href="javascript:;">添加员工</a><br /><br />

    <div class="layui-form">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">中文版</label>
                <div class="layui-input-inline">
                    <input class="layui-input" id="test1" type="text" placeholder="yyyy-MM-dd">
                </div>
            </div>
        </div>
    </div>

    <div class="layui-row" id="popSearchRoleTest" style="display:none;">
        <div class="layui-col-md11">
            <form class="layui-form" lay-filter="formTestFilter">
                <div class="layui-form-item">
                    <label class="layui-form-label">员工姓名:</label>
                    <div class="layui-input-inline"> <input type="text" name="empName" class="layui-input"> </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">员工性别:</label>
                    <div class="layui-input-block">
                        <input type="radio" name="sex" value="男" title="男">
                        <input type="radio" name="sex" value="女" title="女" checked>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">员工年龄</label>
                    <div class="layui-input-inline">
                        <select name="city" lay-verify="required">
                            <option value="0">请选择</option>
                            <option value="1">18</option>
                            <option value="2">19</option>
                            <option value="3">20</option>
                            <option value="4">21</option>
                            <option value="5">22</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">出生日期:</label>
                    <div class="layui-input-inline"> <input type="datetime" name="empbirthday" class="layui-input" οnclick="return false;"> </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">出生日期</label>
                        <div class="layui-input-inline">
                            <input class="layui-input" id="time" name="time" type="text" placeholder="yyyy-MM-dd">
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">员工职位</label>
                    <div class="layui-input-inline">
                        <select name="city" lay-verify="required">
                            <option value="0">请选择</option>
                            <option value="1">董事</option>
                            <option value="2">经理</option>
                            <option value="3">店长</option>
                            <option value="4">发型师</option>
                            <option value="5">助理</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">联系方式:</label>
                    <div class="layui-input-inline"> <input type="text" name="empPhone" class="layui-input"> </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">入职时间:</label>
                    <div class="layui-input-inline"> <input type="text" name="empEntryTime" class="layui-input"> </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <script src="layui/layui.js"></script>
    <script src="layui/layui.all.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        layui.use(["jquery", "layer", "form", "laydate"], function() {
            var $ = layui.$,
                layer = layui.layer,
                form = layui.form,
                laydate = layui.laydate;
            //监听提交
            form.on('submit(popSearchRoleTest)', function(data) {
                layer.msg(JSON.stringify(data.field));
                return false;
            });

            $("#test").click(function() {
                hello();
            });
            window.hello = function() {


                layer.open({ //layer提供了5种层类型。可传入的值有:0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层)          
                    type: 1,
                    title: "查找用户角色",
                    area: ['100%', '100%'],
                    content: $("#popSearchRoleTest").html(),

                    success: function() {
                        $(this).removeAttr("lay-key");
                        laydate.render({
                            elem: '#time',
                            type: 'date',
                            trigger: 'click',
                        });
                        form.render();

                    },

                });



            }
            form.on('submit(formDemo)', function(data) {
                /* window.console.log(data.field); */
                $.ajax({
                    type: "post",
                    url: "http://localhost:8080/jiangdao/emp.action?methodName=addEmp",
                    data: data.field,
                    dataType: "json",
                    success: (responseText) => {
                        window.console.log("连接成功了" + responseText);
                    },
                    error: () => {
                        alert("服务器大大病了")
                    }
                });
                return false;
            });
        });
    </script>

</body>

  • 点赞
  • 回答
  • 收藏
  • 复制链接分享

1条回答