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

未结贴
10 1626


利用弹出层弹出了一个添加页面,含表单。如何利用弹窗的按钮进行验证用户是否填写内容呢?
而不用再页面里面添加如下的提交按钮
<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 回复
最近热帖
为什么设计项目最初要为数据设计身份指纹(唯一标号)? 683
利用FormData和Ajax批量上传文件 565
XUI 0.1版本发布 为企业移动信息化而生 405
后台模板免费版出来了吗?都月底了 @贤心 389
关于layui版本升级的几点建议 303
完整的省市区三级联动菜单 284
关于Layui分页问题-带参数的异步请求 226
月底了,2.0有消息吗? 222
出大事了,求助 ,各位大大,拜托了,我搞几天了都 196
upload上传成功,提示 跨域的问题,且不执行回掉函数 145
近期热议
出大事了,求助 ,各位大大,拜托了,我搞几天了都 27
在线等,如何 让 一开始from 查询不查询 等点了按钮才查询 16
upload上传成功,提示 跨域的问题,且不执行回掉函数 11
利用FormData和Ajax批量上传文件 10
layui.form在火狐下的bug 10
为什么input的样式没有显示?、 10
Layui的select不显示,会是什么原因呢? 8
button的点击用哪个监听 7
layui iframe如何用js跳转到指定页 7
关于layer父子页面传值问题 7