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

未结贴
10 1347


利用弹出层弹出了一个添加页面,含表单。如何利用弹窗的按钮进行验证用户是否填写内容呢?
而不用再页面里面添加如下的提交按钮
<button lay-submit lay-filter="*">提交</button>  

热忱回答10



  • 看这个图比较能理解
    0 回复
  • 0 回复
  • form表单外的按钮如何触发form表单的验证
    0 回复
  • @YU糖糖 就是form表单外的按钮如何触发form表单内的input的验证
    0 回复
  • 没找到可以单独调用验证的方法,暂时用如下解决:
    通过页面上的添加按钮打开弹窗,在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 回复
  • yes:function(index,layero){
    $("要验证的表单").trigger("submit");
    }

    这样不就触发了么
    0 回复
  • @坑丶怪我咯 需要触发 layui 的验证,当所有验证通过之后提交数据到后台。你的方案我测试不能通过,你怎么做到的?
    0 回复
  • 你在表单页面写的验证方法,然后用保存按钮调用?不知道对不对
    0 回复
  • S.Jone S.Jone
    6天前
    $.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 回复
  • @杜风(Victor)爱素食 表单不是submit的时候验证的 那么就是输入的时候验证的咯 $("要验证的控件").trigger("keydown")或$("要验证的控件").trigger("keyup")
    0 回复

最近热帖

  1. 建议。layer相册,不能实时增加图片。 4099
  2. layui 社区2016年度十佳案例 1939
  3. .Net WebCMS后台管理系统 1604
  4. layui的form组件的响应数据怎么获取 1589
  5. 蓝狐宝社区,一个成长中的社区 574
  6. 贤心是一个人吗?男的还是女的。。。 391
  7. ifram 父页面的 【确定】按钮触发页面的form验证 376
  8. Layim 各平台聊天记录同步问题. 304
  9. 这是一张吐槽贴:关于Fly社区2016案例大赛第一名 287
  10. 也许这就是前端的魅力,我得说两句再睡 210
layim下载

近期热议

  1. layui能否支持 select2.的功能 27
  2. .Net WebCMS后台管理系统 26
  3. 这是一张吐槽贴:关于Fly社区2016案例大赛第一名 18
  4. 表单开关按钮放在模态框内就不显示了,怎么办,急! 15
  5. 蓝狐宝社区,一个成长中的社区 14
  6. layer如何获取 拖动后的坐标位置 offset left和to'p 13
  7. 贤心是一个人吗?男的还是女的。。。 12
  8. layui 社区2016年度十佳案例 12
  9. 【webos】号外 号外 2016年度案例奖励到手 快进来羡慕嫉妒恨啊!!! 11
  10. 关于layui树形菜单当前元素高亮的问题 10