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 相关文章推荐
jQuery 自动增长的文本输入框实现代码
Apr 02 Javascript
Node.js抓取中文网页乱码问题和解决方法
Feb 10 Javascript
jquery+css实现的红色线条横向二级菜单效果
Aug 22 Javascript
jquery form表单获取内容以及绑定数据
Feb 24 Javascript
js 博客内容进度插件详解
Feb 19 Javascript
在 Angular中 使用 Lodash 的方法
Feb 11 Javascript
react-native android状态栏的实现
Jun 15 Javascript
基于JS实现前端压缩上传图片的实例代码
May 14 Javascript
微信小程序 自定义复选框实现代码实例
Sep 04 Javascript
vue-resource:jsonp请求百度搜索的接口示例
Nov 09 Javascript
JS实现iframe中子父页面跨域通讯的方法分析
Mar 10 Javascript
ES6函数和数组用法实例分析
May 23 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初学者头疼问题总结
2006/07/08 PHP
PHP字符串 ==比较运算符的副作用
2009/10/21 PHP
php 数组二分法查找函数代码
2010/02/16 PHP
PHP+MySQL修改记录的方法
2015/01/21 PHP
php实现每日签到功能
2018/11/29 PHP
document.getElementBy(&quot;id&quot;)与$(&quot;#id&quot;)有什么区别
2013/09/22 Javascript
jQuery Ajax异步处理Json数据详解
2013/11/05 Javascript
jQuery事件绑定on()、bind()与delegate() 方法详解
2015/06/03 Javascript
chrome调试javascript详解
2015/10/21 Javascript
jQuery的Each比JS原生for循环性能慢很多的原因
2016/07/05 Javascript
javascript实现的全国省市县无刷新多级关联菜单效果代码
2016/08/01 Javascript
通过JS和PHP两种方法判断用户请求时使用的浏览器类型
2016/09/01 Javascript
利用Javascript仿Excel的数据透视分析功能
2016/09/07 Javascript
bootstrap table配置参数例子
2017/01/05 Javascript
JS实现评价的星星功能
2017/08/20 Javascript
JS实现可用滑块滑动的缓动图代码
2019/09/01 Javascript
如何基于js判断浏览器版本
2020/02/20 Javascript
js验证账户名是否重复
2020/05/26 Javascript
python基础教程之自定义函数介绍
2014/08/29 Python
Python文件操作基本流程代码实例
2017/12/11 Python
解决csv.writer写入文件有多余的空行问题
2018/07/06 Python
Numpy截取指定范围内的数据方法
2018/11/14 Python
python爬虫 urllib模块发起post请求过程解析
2019/08/20 Python
PyCharm导入python项目并配置虚拟环境的教程详解
2019/10/13 Python
python怎么自定义捕获错误
2020/06/29 Python
Python 多线程C段扫描、检测 Ping扫描脚本的实现
2020/09/03 Python
微信浏览器左上角返回按钮拦截功能
2017/11/21 HTML / CSS
玲玲的画教学反思
2014/02/04 职场文书
毕业寄语大全
2014/04/09 职场文书
学校安全防火方案
2014/06/07 职场文书
代领毕业证委托书
2014/08/02 职场文书
学院党的群众路线教育实践活动第一阶段情况汇报
2014/10/25 职场文书
2014年标准化工作总结
2014/12/17 职场文书
2015年乡镇扶贫工作总结
2015/04/08 职场文书
2019运动会广播加油稿汇总
2019/08/21 职场文书
JavaScript实例 ODO List分析
2022/01/22 Javascript