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实现读取txt文档的脚本
Jul 20 Javascript
javaScript矢量图表库-gRaphael几行代码实现精美的条形图/饼图/点图/曲线图
Jan 09 Javascript
减少访问DOM的次数提升javascript性能
Feb 24 Javascript
同一个网页中实现多个JavaScript特效的方法
Feb 02 Javascript
浅谈JavaScript中的Math.atan()方法的使用
Jun 14 Javascript
React-router中结合webpack实现按需加载实例
May 25 Javascript
React Native实现地址挑选器功能
Oct 24 Javascript
纯js代码生成可搜索选择下拉列表的实例
Jan 11 Javascript
js实现导航跟随效果
Nov 17 Javascript
JS中使用new Option()实现时间联动效果
Dec 10 Javascript
Mint UI组件库CheckList使用及踩坑总结
Dec 20 Javascript
新年快乐! javascript实现超级炫酷的3D烟花特效
Jan 30 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网页游戏学习之Xnova(ogame)源码解读(十四)
2014/06/26 PHP
php下载远程大文件(获取远程文件大小)的实例
2017/06/17 PHP
使用jscript实现二进制读写脚本代码
2008/06/09 Javascript
jquery keypress,keyup,onpropertychange键盘事件
2010/06/25 Javascript
本地对象Array的原型扩展实现代码
2010/12/04 Javascript
Bootstrap Chart组件使用教程
2016/04/28 Javascript
jQuery学习笔记——jqGrid的使用记录(实现分页、搜索功能)
2016/11/09 Javascript
jQuery延迟执行的实现方法
2016/12/21 Javascript
微信小程序 图片宽高自适应详解
2017/05/11 Javascript
JavaScript之DOM_动力节点Java学院整理
2017/07/03 Javascript
网页中的图片查看器viewjs使用方法
2017/07/11 Javascript
深入理解angular2启动项目步骤
2017/07/15 Javascript
jQuery.Sumoselect插件实现下拉复选框效果
2017/11/09 jQuery
js prototype和__proto__的关系是什么
2019/08/23 Javascript
node.js基于dgram数据报模块创建UDP服务器和客户端操作示例
2020/02/12 Javascript
JS数组扁平化、去重、排序操作实例详解
2020/02/24 Javascript
Vue自定义组件的四种方式示例详解
2020/02/28 Javascript
微信小程序点击按钮动态切换input的disabled禁用/启用状态功能
2020/03/07 Javascript
python中字典(Dictionary)用法实例详解
2015/05/30 Python
关于反爬虫的一些简单总结
2017/12/13 Python
Python使用pip安装报错:is not a supported wheel on this platform的解决方法
2018/01/23 Python
Django进阶之CSRF的解决
2018/08/01 Python
pandas 缺失值与空值处理的实现方法
2019/10/12 Python
Python计算公交发车时间的完整代码
2020/02/12 Python
python爬虫开发之urllib模块详细使用方法与实例全解
2020/03/09 Python
对python中return与yield的区别详解
2020/03/12 Python
史上最详细的Python打包成exe文件教程
2021/01/17 Python
Viking Direct荷兰:购买办公用品
2019/06/20 全球购物
mysql_pconnect()和mysql_connect()有什么区别
2012/05/25 面试题
中西医结合临床医学专业大学生自荐信
2013/09/28 职场文书
文案策划求职信
2014/04/14 职场文书
人事行政经理岗位职责
2014/06/18 职场文书
2014年基层党支部工作总结
2014/12/04 职场文书
2014收银员工作总结范文
2014/12/16 职场文书
行政处罚听证告知书
2015/07/01 职场文书
三八红旗手先进事迹材料(2016推荐版)
2016/02/25 职场文书