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中的apply()方法和call()方法使用介绍
Jul 25 Javascript
JS的document.all函数使用示例
Dec 30 Javascript
javascript白色简洁计算器
May 04 Javascript
Javascript中String的常用方法实例分析
Jun 13 Javascript
JavaScript 消息框效果【实现代码】
Apr 27 Javascript
正则表达式(语法篇推荐)
Jun 24 Javascript
微信小程序 picker-view 组件详解及简单实例
Jan 10 Javascript
jQuery实现的简单悬浮层功能完整实例
Jan 23 Javascript
jquery请求servlet实现ajax异步请求的示例
Jun 03 jQuery
jQuery实现拖动效果的实例代码
Jun 25 jQuery
JS实现进度条动态加载特效
Mar 25 Javascript
JavaScript实现九宫格拖拽效果
Jun 28 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
一个程序下载的管理程序(二)
2006/10/09 PHP
适用于抽奖程序、随机广告的PHP概率算法实例
2014/04/09 PHP
实现PHP+Mysql无限分类的方法汇总
2015/03/02 PHP
PHP中字符串长度的截取用法示例
2017/01/12 PHP
js 解决“options为空或不是对象”
2008/12/22 Javascript
JavaScript入门教程(12) js对象化编程
2009/01/31 Javascript
JavaScript 事件系统
2010/07/22 Javascript
js操作iframe的一些方法介绍
2013/06/25 Javascript
轻松创建nodejs服务器(7):阻塞操作的实现
2014/12/18 NodeJs
Windows系统下使用Sublime搭建nodejs环境
2015/04/13 NodeJs
日常收集整理的JavaScript常用函数方法
2015/12/10 Javascript
使用Function.apply()的参数数组化来提高 JavaScript程序性能的技巧
2015/12/23 Javascript
完善的jquery处理机制
2016/02/21 Javascript
JS加载器如何动态加载外部js文件
2016/05/26 Javascript
第三篇Bootstrap网格基础
2016/06/21 Javascript
详解基于node的前端项目编译时内存溢出问题
2017/08/01 Javascript
jQuery实现每隔一段时间自动更换样式的方法分析
2018/05/03 jQuery
详解angular部署到iis出现404解决方案
2018/08/14 Javascript
uniapp电商小程序实现订单30分钟倒计时
2020/11/01 Javascript
[52:14]VG vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
通过Python实现自动填写调查问卷
2017/09/06 Python
Windows 7下Python Web环境搭建图文教程
2018/03/20 Python
超简单的Python HTTP服务
2019/07/22 Python
python字典与json转换的方法总结
2020/12/28 Python
python利用后缀表达式实现计算器功能
2021/02/22 Python
HTML5 与 XHTML2
2008/10/17 HTML / CSS
ParcelABC西班牙:包裹运送和快递服务
2019/12/24 全球购物
init进程的作用
2015/08/20 面试题
经典优秀个人求职自荐信格式
2013/09/25 职场文书
文秘专业应届生求职信范文
2013/11/14 职场文书
社区个人对照检查材料(群众路线)
2014/09/26 职场文书
2014年学生会主席工作总结
2014/11/07 职场文书
南京南京观后感
2015/06/02 职场文书
小学教师暑期培训心得体会
2016/01/09 职场文书
python画条形图的具体代码
2022/04/20 Python
JS高级程序设计之class继承重点详解
2022/07/07 Javascript