layer父页获取弹出层输入框里面的值方法


Posted in Javascript onSeptember 02, 2019

主要是因为修改功能,原来页面填写数据如图

layer父页获取弹出层输入框里面的值方法

改为

layer父页获取弹出层输入框里面的值方法

其中点击填写明细弹出框

layer父页获取弹出层输入框里面的值方法

填写完毕后点击确认返回,同事这里因为她是存的多表,所以点击确认就直接保存数据了,改的这个功能原本保存是整体保存,我就不想改原来的逻辑,只想把填写的值带回去用隐藏控件存一下,到时候按照原来的逻辑整体存,所以没办法参考她的,最后搜索很多,解决了问题,具体代码如下:

父页面:

<div class="row">
<div class="col-md-6">
<div class="form-group PadTB10">
<label class="LabelW150">
经费来源总计(元)</label>
<input type="text" readonly="readonly" class="form-control" id="AmountSum" name="AmountSum" onkeyup="value=value.replace(/[^\d.]/g,'')" placeholder="填写来源明细" value="@pro.AmountSum"/>
<input type="button" value="填写来源明细" onclick="ShowAmountDetail()" />
<input type="hidden" name="CenterAmount" id="CenterAmount" value="@pro.CenterAmount" />
<input type="hidden" name="CityAmount" id="CityAmount" value="@pro.CityAmount" />
<input type="hidden" name="DisAmount" id="DisAmount" value="@pro.DisAmount" />
<input type="hidden" name="StreetAmount" id="StreetAmount" value="@pro.StreetAmount" />
<input type="hidden" name="OtherAmount" id="OtherAmount" value="@pro.OtherAmount" />
</div>
</div>
</div>

js:

//弹出经费来源明细
function ShowAmountDetail() {
var index = layer.open({
type: 2,
title: '填写经费明细',
shadeClose: false,
skin: 'layui-layer-rim',
area: ['50%', '50%'],
maxmin: true,
content: '/Project/AmountDetail?ProjectCode=' + "@ProjectCode",
btn: ['确定', '关闭'],
yes: function (index, layero) {
debugger;
var body = layer.getChildFrame('body', index); //得到iframe页的body内容
var CenterAmount = body.find("#CenterAmount").val();
var CityAmount = body.find("#CityAmount").val();
var DisAmount = body.find("#DisAmount").val();
var StreetAmount = body.find("#StreetAmount").val();
var OtherAmount = body.find("#OtherAmount").val();
if (CenterAmount == null || CenterAmount == "") CenterAmount = 0;
if (CityAmount == null || CityAmount == "") CityAmount = 0;
if (DisAmount == null || DisAmount == "") DisAmount = 0;
if (StreetAmount == null || StreetAmount == "") StreetAmount = 0;
if (OtherAmount == null || OtherAmount == "") OtherAmount = 0;
sum = Number(CenterAmount) + Number(CityAmount) + Number(DisAmount)
+ Number(StreetAmount) + Number(OtherAmount);
document.getElementById("CenterAmount").value = CenterAmount;
document.getElementById("CityAmount").value = CityAmount;
document.getElementById("DisAmount").value = DisAmount;
document.getElementById("StreetAmount").value = StreetAmount;
document.getElementById("OtherAmount").value = OtherAmount;
document.getElementById("AmountSum").value = sum;

//最后关闭弹出层
layer.close(index);
},
cancel: function () {
//右上角关闭回调
}
});
// layer.full(index);
}

子页面:

<!DOCTYPE html>

<html>

<head>
<meta name="viewport" content="width=device-width" />
<title>AmountDetail</title>
</head>
<body>
<div>
<table class="table table-bordered ">
<tr><td rowspan="5" style="text-align: center; vertical-align: middle;">经济来源明细</td><td>中央拨款(元)</td>
<td>
<input id="CenterAmount" class="form-control" onkeyup="value=value.replace(/[^\d.]/g,'')" name="CenterAmount" type="text" />
</td></tr>
<tr><td>市级专款(元)</td>
<td>
<input id="CityAmount" class="form-control" onkeyup="value=value.replace(/[^\d.]/g,'')" name="CityAmount" type="text" />
</td></tr>
<tr><td>区级资金(元)</td>

<td>

<input id="DisAmount" class="form-control" onkeyup="value=value.replace(/[^\d.]/g,'')" name="DisAmount" type="text" />
</td></tr>
<tr><td>街镇配套(元)</td>
<td>
<input id="StreetAmount" class="form-control" onkeyup="value=value.replace(/[^\d.]/g,'')" name="StreetAmount" type="text" "/>
</td></tr>
<tr><td>其他(元)</td>
<td>
<input id="OtherAmount" class="form-control" onkeyup="value=value.replace(/[^\d.]/g,'')" name="OtherAmount" type="text" />
</td></tr>
</table> 
</div>
</body>
</html>

以上这篇layer父页获取弹出层输入框里面的值方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用javascript实现读取txt文档的脚本
Jul 20 Javascript
js控制的回到页面顶端goTop的代码实现
Mar 20 Javascript
html+js实现动态显示本地时间
Sep 21 Javascript
IE6-IE9中tbody的innerHTML不能赋值的解决方法
Sep 26 Javascript
jQuery实现的鼠标滑过弹出放大图片特效
Jan 08 Javascript
jquery.serialize() 函数语法及简单实例
Jul 08 Javascript
jQuery与JS加载事件用法分析
Sep 04 Javascript
vue中实现移动端的scroll滚动方法
Mar 03 Javascript
利用npm 安装删除模块的方法
May 15 Javascript
vue+axios新手实践实现登陆的示例代码
Jun 06 Javascript
vue单页面实现当前页面刷新或跳转时提示保存
Nov 02 Javascript
vue输入节流,避免实时请求接口的实例代码
Oct 30 Javascript
详解element-ui表格中勾选checkbox,高亮当前行
Sep 02 #Javascript
详解基于Vue的支持数据双向绑定的select组件
Sep 02 #Javascript
layui当点击文本框时弹出选择框,显示选择内容的例子
Sep 02 #Javascript
Vue内部渲染视图的方法
Sep 02 #Javascript
一步一步实现Vue的响应式(对象观测)
Sep 02 #Javascript
Layui多选只有最后一个值的解决方法
Sep 02 #Javascript
解决layui checkbox 提交多个值的问题
Sep 02 #Javascript
You might like
PHP+MYSQL 出现乱码的解决方法
2008/08/08 PHP
在mysql数据库原有字段后增加新内容
2009/11/26 PHP
PHP Zip解压 文件在线解压缩的函数代码
2010/05/26 PHP
windows下zendframework项目环境搭建(通过命令行配置)
2012/12/06 PHP
解析PHP强制转换类型及远程管理插件的安全隐患
2014/06/30 PHP
最常用的8款PHP调试工具
2014/07/06 PHP
php获取图片信息的方法详解
2015/12/10 PHP
PHP针对伪静态的注入总结【附asp与Python相关代码】
2017/08/01 PHP
跟着Jquery API学Jquery之一 选择器
2010/04/07 Javascript
js选择并转移导航菜单示例代码
2014/08/19 Javascript
JS Attribute属性操作详解
2016/05/19 Javascript
Angularjs在初始化未完毕时出现闪烁问题的解决方法分析
2016/08/05 Javascript
js, jQuery实现全选、反选功能
2017/03/08 Javascript
利用Angular.js编写公共提示模块的方法教程
2017/05/28 Javascript
探讨Vue.js的组件和模板
2017/10/27 Javascript
JS实现的贪吃蛇游戏案例详解
2019/05/01 Javascript
Javascript作用域和作用域链原理解析
2020/03/03 Javascript
JS实现鼠标按下拖拽效果
2020/07/23 Javascript
Python set集合类型操作总结
2014/11/07 Python
Python中的特殊语法:filter、map、reduce、lambda介绍
2015/04/14 Python
python append、extend与insert的区别
2016/10/13 Python
Python 删除整个文本中的空格,并实现按行显示
2018/07/24 Python
对Python信号处理模块signal详解
2019/01/09 Python
Django 限制访问频率的思路详解
2019/12/24 Python
不到20行实现Python代码即可制作精美证件照
2020/04/24 Python
CSS实现鼠标滑过鼠标点击代码写法
2016/12/26 HTML / CSS
小区门卫岗位职责
2013/12/31 职场文书
教师个人鉴定材料
2014/02/08 职场文书
火灾现场处置方案
2014/05/28 职场文书
超市七夕促销活动方案
2014/08/28 职场文书
镇政府副镇长群众路线专题民主生活会对照检查材料
2014/09/19 职场文书
2014年幼儿园教学工作总结
2014/12/04 职场文书
2015年大学班长个人工作总结
2015/04/24 职场文书
2015年后备干部工作总结
2015/05/15 职场文书
教师节老师寄语
2015/05/28 职场文书
2019毕业典礼主持词!
2019/07/05 职场文书