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 相关文章推荐
QUnit jQuery的TDD框架
Nov 04 Javascript
JavaScript 面向对象与原型
Apr 10 Javascript
JavaScript实现为input与textarea自定义hover,focus效果的方法
Aug 21 Javascript
Bootstrap图片轮播组件使用实例解析
Jun 30 Javascript
js获取浏览器的各种属性
Apr 27 Javascript
Angular 4.X开发实践中的踩坑小结
Jul 04 Javascript
jQuery实现的鼠标滚轮控制图片缩放功能实例
Oct 14 jQuery
解决vue页面DOM操作不生效的问题
Mar 17 Javascript
在小程序Canvas中使用measureText的方法示例
Oct 19 Javascript
微信小程序实现的日期午别医生排班表功能示例
Jan 09 Javascript
微信小程序使用echarts获取数据并生成折线图
Oct 16 Javascript
js实现的在本地预览图片功能示例
Nov 09 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
DC的38部超级英雄动画电影
2020/03/03 欧美动漫
PHP中register_globals参数为OFF和ON的区别(register_globals 使用详解)
2012/02/05 PHP
php弹出对话框实现重定向代码
2014/01/23 PHP
ajax+php控制所有后台函数调用
2015/07/15 PHP
ThinkPHP下表单令牌错误与解决方法分析
2017/05/20 PHP
用js实现控件的隐藏及style.visibility的使用
2013/06/14 Javascript
jquery和css3实现的炫酷时尚的菜单导航
2014/09/01 Javascript
让angularjs支持浏览器自动填表
2014/11/10 Javascript
node.js中格式化数字增加千位符的几种方法
2015/07/03 Javascript
Knockoutjs 学习系列(二)花式捆绑
2016/06/07 Javascript
jQuery查找节点方法完整实例
2016/09/13 Javascript
Ajax高级笔记 JavaScript高级程序设计笔记
2017/06/22 Javascript
vue 使用Jade模板写html,stylus写css的方法
2018/02/23 Javascript
vue iview组件表格 render函数的使用方法详解
2018/03/15 Javascript
vue实现二级导航栏效果
2019/10/19 Javascript
Vue 通过公共字段,拼接两个对象数组的实例
2019/11/07 Javascript
Vue axios 跨域请求无法带上cookie的解决
2020/09/08 Javascript
[52:41]OG vs IG 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/20 DOTA
简介Python设计模式中的代理模式与模板方法模式编程
2016/02/02 Python
在Ubuntu系统下安装使用Python的GUI工具wxPython
2016/02/18 Python
python如何定义带参数的装饰器
2018/03/20 Python
基于pandas数据样本行列选取的方法
2018/04/20 Python
python粘包问题及socket套接字编程详解
2019/06/29 Python
解决python3 安装不了PIL的问题
2019/08/16 Python
python编写猜数字小游戏
2019/10/06 Python
Python Django框架模板渲染功能示例
2019/11/08 Python
浅谈Tensorflow加载Vgg预训练模型的几个注意事项
2020/05/26 Python
使用OpenCV实现人脸图像卡通化的示例代码
2021/01/15 Python
美国最大点评网站:Yelp
2018/02/14 全球购物
捷克家电和家具购物网站:OKAY.cz
2020/07/23 全球购物
西式结婚主持词
2014/03/14 职场文书
个人自查自纠材料
2014/10/14 职场文书
社会实践活动报告
2015/02/05 职场文书
2015年幼儿园卫生保健工作总结
2015/05/12 职场文书
幸福来敲门观后感
2015/06/04 职场文书
廉政党课工作报告案例
2019/06/21 职场文书