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 相关文章推荐
Extjs Ajax 乱码问题解决方案
Apr 15 Javascript
Mootools 1.2教程 设置和获取样式表属性
Sep 15 Javascript
jquery复选框多选赋值给文本框的方法
Jan 27 Javascript
require.js的用法详解
Oct 20 Javascript
js实现省市级联效果分享
Aug 10 Javascript
JS轮播图实现简单代码
Feb 19 Javascript
Vue实现typeahead组件功能(非常靠谱)
Aug 26 Javascript
基于vue+canvas的excel-like组件实例详解
Nov 28 Javascript
easyui下拉框动态级联加载的示例代码
Nov 29 Javascript
MVVM框架下实现分页功能示例
Jun 14 Javascript
js事件on动态绑定数据,绑定多个事件的方法
Sep 15 Javascript
Vuex中的State使用介绍
Jan 19 Javascript
使用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调用三种数据库的方法(1)
2006/10/09 PHP
PHP Directory 函数的详解
2013/03/07 PHP
php自动识别文件编码并转换为UTF-8的方法
2014/06/12 PHP
引用外部脚本时script标签关闭的写法
2014/01/20 Javascript
js设置function参数默认值(适合没有传参情况)
2014/02/24 Javascript
Javascript玩转继承(三)
2014/05/08 Javascript
显示今天的日期js代码(阳历和农历)
2014/09/30 Javascript
input输入框鼠标焦点提示信息
2015/03/17 Javascript
如何用js实现鼠标向上滚动时浮动导航
2016/07/18 Javascript
jQuery Ajax Post 回调函数不执行问题的解决方法
2016/08/15 Javascript
BOM系列第三篇之定时器应用(时钟、倒计时、秒表和闹钟)
2016/08/17 Javascript
Javascript中arguments对象的详解与使用方法
2016/10/04 Javascript
微信小程序 122100版本更新问题解决方案
2016/12/22 Javascript
JavaScript用构造函数如何获取变量的类型名
2016/12/23 Javascript
jQuery实现动态控制页面元素的方法分析
2017/12/20 jQuery
mpvue小程序仿qq左滑置顶删除组件
2018/08/03 Javascript
javascriptvoid(0)含义以及与&quot;#&quot;的区别讲解
2019/01/19 Javascript
VUE实现图片验证码功能
2020/11/18 Javascript
Python的re模块正则表达式操作
2016/05/25 Python
python中numpy包使用教程之数组和相关操作详解
2017/07/30 Python
Scrapy抓取京东商品、豆瓣电影及代码分享
2017/11/23 Python
Python安装lz4-0.10.1遇到的坑
2018/05/20 Python
Python版名片管理系统
2018/11/30 Python
Python中常用的os操作汇总
2020/11/05 Python
python IP地址转整数
2020/11/20 Python
德国机场停车位比较和预订网站:Ich-parke-billiger
2018/01/08 全球购物
英国家庭家具、照明和花园家具购物网站:Furniture123
2018/12/31 全球购物
简述进程的启动、终止的方式以及如何进行进程的查看
2014/02/20 面试题
软件测试笔试题
2012/10/25 面试题
Delphi软件工程师试题
2013/01/29 面试题
初中三好学生自我鉴定
2014/04/07 职场文书
优秀纪检干部材料
2014/08/27 职场文书
体育运动会广播稿
2014/10/05 职场文书
幼师个人总结范文
2015/02/28 职场文书
导游词之湖北梁子湖
2019/11/07 职场文书
mysql知识点整理
2021/04/05 MySQL