弹窗中的表单如何利用弹窗的默认按钮进行验证?[解决]

未结贴
11 1839


利用弹出层弹出了一个添加页面,含表单。如何利用弹窗的按钮进行验证用户是否填写内容呢?
而不用再页面里面添加如下的提交按钮
<button lay-submit lay-filter="*">提交</button>  
  • 杜风(Victor)爱素食 杜风(Victor)爱素食
    2017-01-06 11:44:24


    看这个图比较能理解
    0 回复
  • YUR糖糖 YUR糖糖 VIP1
    2017-01-06 13:54:54
    0 回复
  • 杜风(Victor)爱素食 杜风(Victor)爱素食
    2017-01-06 14:00:36
    form表单外的按钮如何触发form表单的验证
    0 回复
  • 杜风(Victor)爱素食 杜风(Victor)爱素食
    2017-01-06 14:03:45
    @YU糖糖 就是form表单外的按钮如何触发form表单内的input的验证
    0 回复
  • 杜风(Victor)爱素食 杜风(Victor)爱素食
    2017-01-06 14:55:23
    没找到可以单独调用验证的方法,暂时用如下解决:
    通过页面上的添加按钮打开弹窗,在success回掉事件里面对弹窗进行操作,将弹窗添加"layui-form"class以及需要设置添加按钮的添加属性[‘lay-filter’,‘lay-submit’],最后在yes事件里面监听按钮的提交事件。
     layui.use(['icheck', 'laypage', 'layer', 'site'], function () {
    var $ = layui.jquery,
    laypage = layui.laypage,
    layer = parent.layer === undefined ? layui.layer : parent.layer,
    site = layui.site,
    form = parent.layui.form();
    $('input').iCheck({
    checkboxClass: 'icheckbox_flat-green'
    });

    $('#add').on('click', function () {
    $.get('/Views/temp/add-article-category.html', null, function (contents) {
    layer.open({
    type: 1,
    title: '添加文章类型',
    content: contents,
    btn: ['保存', '取消'],
    area: ['600px', '600px'],
    maxmin: true,
    success: function (layero, index) {
    layero.addClass('layui-form');//添加form标识
    layero.find('.layui-layer-btn0').attr('lay-filter', 'fromContent').attr('lay-submit', '');//将按钮弄成能提交的
    form.render();
    },
    yes: function (index, layero) {
    form.on('submit(fromContent)', function (data) {
    site.ajax('/SysAdmin/AddData', layero.find('form').eq(0).serialize(), index);
    });
    }
    });
    });
    });
    });





    最笨的方法,就这样吧。

    你们有没有更简单的方法呀?提供下,我觉得这个有点麻烦,不知道有没有那种直接调用某个方法来验证form表单的内容是否满足提交条件的。
    0 回复
  • 坑丶怪我咯 坑丶怪我咯
    2017-01-06 15:14:50
    yes:function(index,layero){
    $("要验证的表单").trigger("submit");
    }

    这样不就触发了么
    0 回复
  • 杜风(Victor)爱素食 杜风(Victor)爱素食
    2017-01-06 15:44:21
    @坑丶怪我咯 需要触发 layui 的验证,当所有验证通过之后提交数据到后台。你的方案我测试不能通过,你怎么做到的?
    0 回复
  • 伊修特利 伊修特利
    2017-01-11 11:40:42
    你在表单页面写的验证方法,然后用保存按钮调用?不知道对不对
    0 回复
  • S.Jone S.Jone
    2017-01-12 14:31:32
    $.ajax({
    cache: true,
    type: "POST",
    url: "/News/AddNews",
    data: { newsid: newsid, small: small, title: title, txtconetent: txtconetent, newstype: newstype, sort: sort, date: date },
    async: true,
    success: function (data) {
    if (data.newsid > 0) {

    fanhui();
    layer.msg('操作成功',
    {
    time: 1500
    });
    loadpage();
    layui.use(['laypage'], function () {
    var laypage = layui.laypage;
    laypage({
    cont: 'page',
    pages: datacount, //总页数
    groups: 5,//连续显示分页数
    first: "首页",
    last: "末页",
    skip: true,
    hash: "page",
    curr: onpage,
    jump: function (obj, first) {
    var curr = obj.curr;
    if (!first) {
    onpage = curr;
    layer.msg('第 ' + curr + ' 页', { time: 600 });
    }
    datalist(curr);
    }
    });
    });
    }
    }
    });
    0 回复
  • 坑丶怪我咯 坑丶怪我咯
    2017-01-16 11:16:09
    @杜风(Victor)爱素食 表单不是submit的时候验证的 那么就是输入的时候验证的咯 $("要验证的控件").trigger("keydown")或$("要验证的控件").trigger("keyup")
    0 回复
  • Z167 Z167
    2天前
    这个问题解决了吗,求楼主分享下解决方案
    0 回复
最近热帖
layui所在服务器近期连续遭受DDoS攻击 3322
vip-admin Html v1.7.0 更新了 - 基于layui的后台模板 970
用layui做管理后台的请进 671
有学生愿意接活干吗?做网站!价格不是很高但是经常有活干 449
select 下拉复选框 244
小魔方看到请进来,你的解决方法有bug 209
layui的编辑器是怎么配置出来的啊,难道不是layedit? 201
发现最新版layui的一个小BUG 177
layui和vue的相性貌似不是很好,求解 174
初次使用layer 发生了,这种情况,究竟是为何? 169
近期热议
layui所在服务器近期连续遭受DDoS攻击 35
弹出层不能置顶!! 12
初次使用layer 发生了,这种情况,究竟是为何? 12
急!修改回显问题~~~~ 10
layui的编辑器是怎么配置出来的啊,难道不是layedit? 10
各位大神们早上好,小弟有一个问题。 10
求救关于layer.msg的问题 9
求助。。。循环绑定传值问题 9
小魔方看到请进来,你的解决方法有bug 8
【求助】layer弹层,type1,firefox,ie8—11,当元素display为none,无 7