当前位置: 首页 > 工具软件 > EasyAdmin > 使用案例 >

关于easyadmin的表单提交

龙玄天
2023-12-01

 由于使用的是layui,所以用法如下

html代码:

<div class="layui-btn layui-btn-sm layui-btn-success btnYuyue" data-seenum="{$vo.see_num}" data-fee="{$vo.doctor_price}" data-time="{$vo.start_time}-{$vo.end_time}" data-id="{$vo.time_id}">预约</div>

<script type="text/html" id="modelUser">
    <form id="modelYueForm" lay-filter="modelYueForm" class="layui-form model-form" style="padding:30px;">
        <div class="layui-form-item">
            <label class="layui-form-label">就诊号:</label>
            <div class="layui-input-block">
                <input name="the_num" id="the_num" type="text" class="layui-input" maxlength="20"
                       lay-verType="tips" lay-verify="required" required/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">挂号费:</label>
            <div class="layui-input-block">
                <input name="the_fee" id="the_fee" type="text" class="layui-input" maxlength="20"
                       lay-verType="tips" lay-verify="required" required/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">挂号时间:</label>
            <div class="layui-input-block">
                <input name="the_time" id="the_time" type="text" class="layui-input" maxlength="20"
                       lay-verType="tips" lay-verify="required" required/>
            </div>
        </div>
        <input type="hidden" name="time_id" id="time_id" value=""/>
        <div class="layui-form-item text-right" style="margin-left:300px;">
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
            <button class="layui-btn" lay-filter="modelYueForm" lay-submit>保存</button>
        </div>
    </form>
</script>

 js代码如下

layui.use(['layer', 'form'], function () {
                var layer = layui.layer;
                var form = layui.form;
                // 显示表单弹窗
                $('.btnYuyue').click(function (e) {
                    //console.log(e.currentTarget.dataset.seenum);
                    showEditModel();
                   // $('#the_num').attr('value',e.currentTarget.dataset.seenum);
                    $('#the_num').val(e.currentTarget.dataset.seenum);
                    $('#the_time').val(e.currentTarget.dataset.time);
                    $('#the_fee').val(e.currentTarget.dataset.fee);
                    $('#time_id').val(e.currentTarget.dataset.id);
                });

                // 显示表单弹窗
                function showEditModel() {
                    layer.open({
                        type: 1,
                        title: '系统公告' + '<span style="float: right;right: 1px;font-size: 12px;color: #b1b3b9;margin-top: 1px"></span>',
                        area: '1200px',
                        shade: 0.8,
                        id: 'layuimini-notice',
                        //btn: ['查看', '取消'], //原版显示按钮
                        btnAlign: 'c',
                        moveType: 1,
                        content: $('#modelUser').html(),
                        success: function (layero) {
                            // var btn = layero.find('.layui-layer-btn');   原版显示按钮
                            // btn.find('.layui-layer-btn0').attr({
                            //     href: 'https://gitee.com/zhongshaofa/layuimini',
                            //     target: '_blank'
                            // });
                            // 表单提交事件
                            form.on('submit(modelYueForm)', function (data) {
                                //layer.load(2);
                                var url="yuyue";
                                $.post(url, data.field, function (res) {
                                    layer.closeAll('loading');
                                    if (res.code == 200) {
                                        layer.close(dIndex);
                                        layer.msg(res.msg, {icon: 1});
                                        insTb.reload();
                                    } else {
                                        layer.msg(res.msg, {icon: 2});
                                    }
                                }, 'json');
                                return false;
                            });
                        }
                    });
                }
            });

 类似资料: