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 相关文章推荐
很全的显示阴历(农历)日期的js代码
Jan 01 Javascript
javascript实现简单的Map示例介绍
Dec 23 Javascript
js创建表单元素并使用submit进行提交
Aug 14 Javascript
js 打开新页面在屏幕中间的实现方法
Nov 02 Javascript
AngularJS框架中的双向数据绑定机制详解【减少需要重复的开发代码量】
Jan 19 Javascript
js防刷新的倒计时代码 js倒计时代码
Sep 06 Javascript
node.js基于express使用websocket的方法
Nov 09 Javascript
图片加载完成再执行事件的实例
Nov 16 Javascript
JavaScript实现的开关灯泡点击切换特效示例
Jul 08 Javascript
vue v-for 使用问题整理小结
Aug 04 Javascript
JavaScript JSON数据处理全集(小结)
Aug 15 Javascript
elementui实现预览图片组件二次封装
Dec 29 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 操作数组(合并,拆分,追加,查找,删除等)
2012/07/20 PHP
PHP开源开发框架ZendFramework使用中常见问题说明及解决方案
2014/06/12 PHP
php里array_work用法实例分析
2015/07/13 PHP
基于Laravel 5.2 regex验证的正确写法
2019/09/29 PHP
个人总结的一些关于String、Function、Array的属性和用法
2007/01/10 Javascript
JavaScript性能优化 创建文档碎片(document.createDocumentFragment)
2010/07/13 Javascript
自己写的Javascript计算时间差函数
2013/10/28 Javascript
window.print打印指定div实例代码
2013/12/13 Javascript
使用js画图之圆、弧、扇形
2015/01/12 Javascript
jquery实现submit提交表单
2015/02/03 Javascript
Javascript调用函数方法的几种方式介绍
2015/03/20 Javascript
JS常见疑难点分析之match,charAt,charCodeAt,map,search用法分析
2016/12/25 Javascript
JavaScript输入分钟、秒倒计时技巧总结(附代码)
2017/08/17 Javascript
p5.js 毕达哥拉斯树的实现代码
2018/03/23 Javascript
webpack4的迁移的使用方法
2018/05/25 Javascript
bootstrap 路径导航 分页 进度条的实例代码
2018/08/06 Javascript
微信小程序手机号码验证功能的实例代码
2018/08/28 Javascript
node链接mongodb数据库的方法详解【阿里云服务器环境ubuntu】
2019/03/07 Javascript
layui table 表格模板按钮的实例代码
2019/09/21 Javascript
浅谈javascript如何获取文件后缀名
2020/08/07 Javascript
Python实现八皇后问题示例代码
2018/12/09 Python
Python面向对象之类的定义与继承用法示例
2019/01/14 Python
基于django channel实现websocket的聊天室的方法示例
2019/04/11 Python
Django框架实现分页显示内容的方法详解
2019/05/10 Python
WxPython实现无边框界面
2019/11/18 Python
在keras中获取某一层上的feature map实例
2020/01/24 Python
python实现npy格式文件转换为txt文件操作
2020/07/01 Python
Html5实现文件异步上传功能
2017/05/19 HTML / CSS
会计专业毕业生自我评价
2013/09/25 职场文书
公司董事长职责
2013/12/12 职场文书
食堂员工工作职责
2013/12/18 职场文书
自荐信需注意事项
2014/01/25 职场文书
乡镇纠风工作实施方案
2014/03/22 职场文书
新课培训心得体会
2014/09/03 职场文书
工厂仓库管理员岗位职责
2015/04/09 职场文书
Python如何加载模型并查看网络
2022/07/15 Python