layui点击弹框页面 表单请求的方法


Posted in Javascript onSeptember 21, 2019

如下所示:

$("#addSite").click(function () {
  layer.open({
    title: '添加站点',
    type: 1,
    area: ['700px', '400px'],
    content: '<blockquote class="layui-elem-quote layui-text">注意事项: 请填写相关的数据信息! </blockquote>' +
    '<form class="layui-form"> ' +
    '<div class="layui-form-item">' +
    '<div class="layui-inline">' +
    '<label class="layui-form-label">站点名称</label>' +
    '<div class="layui-input-inline">' +
    '<input type="text" required lay-verify="required" name="siteName" class="layui-input" value="" >' +
    '</div></div>' +
    '<div class="layui-inline">' +
    '<label class="layui-form-label">ICP备案号</label>' +
    '<div class="layui-input-inline">' +
    '<input type="text" required lay-verify="required" name="fileRecord"  class="layui-input" value="" >' +
    '</div></div>' +
    '</div>' +
    '<div class="layui-form-item">' +
    '<div class="layui-inline">' +
    '<label class="layui-form-label">联系电话</label>' +
    '<div class="layui-input-inline">' +
    '<input type="text" required lay-verify="required" name="sitePhone" class="layui-input" value="" >' +
    '</div></div>' +
    '<div class="layui-inline">' +
    '<label class="layui-form-label">平台信息</label>' +
    '<div class="layui-input-inline">' +
    '<input type="text" required lay-verify="required" name="type"  class="layui-input" value="" >' +
    '</div></div>' +
    '</div>' +
    '<div class="layui-form-item" style="width: 621px;">' +
    '<label class="layui-form-label">备注</label>' +
    '<div class="layui-input-block">' +
    '<textarea placeholder="请输入内容" name="siteMark" class="layui-textarea"></textarea>' +
    '</div>' +
    '</div>' +
    '</form>',
    btnAlign: 'c',
    btn: ['确定', '取消'],
    yes: function (index, layero) {
      var str = $("input[name=isIndividual]").val();
      if (str == "on") {
        str = "1";
      } else {
        str = "0";
      }

      if ($("input[name=siteName]").val() == null || $("input[name=siteName]").val() == "") {
        layer.msg('请输入站点名称', {icon: 5, time: 2000, area: '200px', type: 0, anim: 6,}, function () {
          $("input[name=siteName]").focus();
        });
        return false;
      } else if ($("input[name=fileRecord]").val() == null || $("input[name=fileRecord]").val() == "") {
        layer.msg('请输入备案号', {icon: 5, time: 2000, area: '200px', type: 0, anim: 6,}, function () {
          $("input[name=fileRecord]").focus();
        });
        return false;
      } else if ($("input[name=type]").val() == null || $("input[name=type]").val() == "") {
        layer.msg('请输入平台信息', {icon: 5, time: 2000, area: '200px', type: 0, anim: 6,}, function () {
          $("input[name=type]").focus();
        });
        return false;
      } else if ($("input[name=sitePhone]").val() == null || $("input[name=sitePhone]").val() == "") {
        layer.msg('请输入联系电话', {icon: 5, time: 2000, area: '200px', type: 0, anim: 6,}, function () {
          $("input[name=sitePhone]").focus();
        });
        return false;
      }
      var formData = {
        siteName: $("input[name=siteName]").val(),
        fileRecord: $("input[name=fileRecord]").val(),
        type: $("input[name=type]").val(),
        sitePhone: $("input[name=sitePhone]").val(),
        siteMark: $("textarea[name=siteMark]").val()
      };
      console.log(formData);
      $.post('${pageContext.request.contextPath}/leaguer/addSite', formData, function (data) {
        //判断是否发送成功
        if (data.code == 200) {
          layer.msg(data.message);
          layer.close(index);
          parent.document.getElementById('my_iframe').contentWindow.location.reload(true);
        } else {
          layer.msg("保存失败...", {type: 1});
        }
      })
    }, btn2: function (index, layero) {
      layer.msg("取消");
      //return false 开启该代码可禁止点击该按钮关闭
    }, cancel: function () {
      layer.msg("关闭窗口");
      //右上角关闭回调
      //return false 开启该代码可禁止点击该按钮关闭
    },
    success: function () {
      layui.use('form', function () {
        var form = layui.form; //只有执行了这一步,部分表单元素才会修饰成功
     form.render('checkbox');
        form.on('checkbox(istrue)', function (data) {
          /* if(data.elem.checked){
           emailConfig['isenterprise']=1;
           }; //是否被选中,true或者false*/
        });
      });
    }
  });
})

另类: tab刷新iframe页面

var iframes= parent.document.getElementsByTagName('iframe');
for(var i=0;i<iframes.length;i++){
var src=iframes[i].contentWindow.location.href;

console.log( src);

if(src.indexOf("table.jsp")!=-1){


console.log( "刷新:"+src);


parent.document.getElementsByTagName('iframe')[i].contentWindow.location.reload(true);

}
}

以上这篇layui点击弹框页面 表单请求的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript学习笔记之 函数篇(二) : this 的工作机制
Jun 24 Javascript
jQuery标签编辑插件Tagit使用指南
Apr 21 Javascript
javascript操作表格排序实例分析
May 06 Javascript
jquery+css实现的红色线条横向二级菜单效果
Aug 22 Javascript
JavaScript实现仿新浪微博大厅和腾讯微博首页滚动特效源码
Sep 15 Javascript
基于jQuery实现放大镜特效
Oct 19 Javascript
用原生JS对AJAX做简单封装的实例代码
Jul 13 Javascript
AngularJS教程之环境设置
Aug 16 Javascript
vue 点击按钮实现动态挂载子组件的方法
Sep 07 Javascript
node全局变量__dirname与__filename的区别
Jan 14 Javascript
Angular 多模块项目构建过程
Feb 13 Javascript
JQuery省市联动效果实现过程详解
May 08 jQuery
使用vue制作滑动标签
Sep 21 #Javascript
layui 数据表格+分页+搜索+checkbox+缓存选中项数据的方法
Sep 21 #Javascript
Vue插件之滑动验证码
Sep 21 #Javascript
Layui tree 下拉菜单树的实例代码
Sep 21 #Javascript
layui 图片上传+表单提交+ Spring MVC的实例
Sep 21 #Javascript
layui layer select 选择被遮挡的解决方法
Sep 21 #Javascript
layui table 表格模板按钮的实例代码
Sep 21 #Javascript
You might like
一个php作的文本留言本的例子(三)
2006/10/09 PHP
PHP实现XML与数据格式进行转换类实例
2015/07/29 PHP
实例讲解PHP设计模式编程中的简单工厂模式
2016/02/29 PHP
php操作redis命令及代码实例大全
2020/11/19 PHP
js实现日期级联效果
2014/01/23 Javascript
javascript比较语义化版本号的实现代码
2016/09/09 Javascript
微信小程序 基础组件与导航组件详细介绍
2017/02/21 Javascript
JavaScript数据结构之二叉树的计数算法示例
2017/04/13 Javascript
Bootstrap的aria-label和aria-labelledby属性实例详解
2018/11/02 Javascript
基于Proxy的小程序状态管理实现
2019/06/14 Javascript
详细分析Node.js 模块系统
2020/06/28 Javascript
分析用Python脚本关闭文件操作的机制
2015/06/28 Python
使用Python保存网页上的图片或者保存页面为截图
2016/03/05 Python
python中将zip压缩包转为gz.tar的方法
2018/10/18 Python
python 函数中的内置函数及用法详解
2019/07/02 Python
python elasticsearch环境搭建详解
2019/09/02 Python
python3 tcp的粘包现象和解决办法解析
2019/12/09 Python
tensorflow实现二维平面模拟三维数据教程
2020/02/11 Python
零基础学python应该从哪里入手
2020/08/11 Python
使用JS+CSS3技术:让你的名字动起来
2013/04/27 HTML / CSS
目前不被任何主流浏览器支持的CSS3属性汇总
2014/07/21 HTML / CSS
佳能英国官方网站:Canon UK
2017/08/08 全球购物
程序员经常用到的UNIX命令
2015/04/13 面试题
自考毕业自我鉴定范文
2013/10/27 职场文书
医学生自我鉴定范文
2013/11/08 职场文书
本科生的职业生涯规划范文
2014/01/09 职场文书
公积金转移接收函
2014/01/11 职场文书
安全大检查反思材料
2014/01/31 职场文书
《画家乡》教学反思
2014/04/22 职场文书
家长建议怎么写
2014/05/15 职场文书
安全口号大全
2014/06/21 职场文书
公司市场专员岗位职责
2014/06/29 职场文书
委托书的写法
2014/08/30 职场文书
家庭贫困证明
2014/09/23 职场文书
指导教师推荐意见
2015/06/05 职场文书
离职员工给领导和同事的感谢信
2015/11/03 职场文书