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 相关文章推荐
jquery 事件执行检测代码
Dec 09 Javascript
js实现浏览器的各种菜单命令比如打印、查看源文件等等
Oct 24 Javascript
jQery使网页在显示器上居中显示适用于任何分辨率
Jun 09 Javascript
javascript将浮点数转换成整数的三个方法
Jun 23 Javascript
js实现简洁的滑动门菜单(选项卡)效果代码
Sep 04 Javascript
jquery读写cookie操作实例分析
Dec 24 Javascript
webpack入门+react环境配置
Feb 08 Javascript
JS组件系列之JS组件封装过程详解
Apr 28 Javascript
基于jQuery中ajax的相关方法汇总(必看篇)
Nov 08 jQuery
js数组常用最重要的方法
Feb 04 Javascript
微信小程序导入Vant报错VM292:1 thirdScriptError的解决方法
Aug 01 Javascript
OpenLayers3加载常用控件使用方法详解
Sep 25 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的QRcode类与大家分享
2011/11/13 PHP
微信获取用户地理位置信息的原理与步骤
2015/11/12 PHP
PHP序列化操作方法分析
2016/09/28 PHP
js修改原型的属性使用介绍
2014/01/26 Javascript
一个js过滤空格的小函数
2014/10/10 Javascript
JQuery右键菜单插件ContextMenu使用指南
2014/12/19 Javascript
JavaScript实现彩虹文字效果的方法
2015/04/16 Javascript
提高jQuery性能优化的技巧
2015/08/03 Javascript
jQuery实现选项联动轮播效果【附实例】
2016/04/19 Javascript
jQuery实现的tab标签切换效果示例
2016/09/05 Javascript
jQuery中ajax错误调试分析
2016/12/01 Javascript
Nodejs搭建wss服务器教程
2017/05/24 NodeJs
解决JS外部文件中文注释出现乱码问题
2017/07/09 Javascript
Node.js上传文件功能之服务端如何获取文件上传进度
2018/02/05 Javascript
微信小程序 子级页面返回父级并把子级参数带回父级实现方法
2019/08/22 Javascript
在vue-cli3.0 中使用预处理器 (Sass/Less/Stylus) 配置全局变量操作
2020/08/10 Javascript
vue 页面跳转的实现方式
2021/01/12 Vue.js
CentOS安装pillow报错的解决方法
2016/01/27 Python
python实现指定字符串补全空格、前面填充0的方法
2018/11/16 Python
Python模拟百度自动输入搜索功能的实例
2019/02/14 Python
Python 获取 datax 执行结果保存到数据库的方法
2019/07/11 Python
python文字和unicode/ascll相互转换函数及简单加密解密实现代码
2019/08/12 Python
Python解压 rar、zip、tar文件的方法
2019/11/19 Python
Python3 main函数使用sys.argv传入多个参数的实现
2019/12/25 Python
keras 权重保存和权重载入方式
2020/05/21 Python
Flask中jinja2的继承实现方法及实例
2021/03/03 Python
基于HTML5 FileSystem API的使用介绍
2013/04/24 HTML / CSS
KIKO MILANO俄罗斯官网:意大利领先的化妆品和护肤品品牌
2021/01/09 全球购物
C#可否对内存进行直接的操作
2015/02/26 面试题
this关键字的作用
2016/01/30 面试题
销售部主管岗位职责
2013/12/18 职场文书
会计工作决心书
2014/03/11 职场文书
会计与出纳自荐书范文
2014/03/16 职场文书
小升初自荐信怎么写
2015/03/26 职场文书
文员岗位职责范本
2015/04/16 职场文书
详细聊聊vue中组件的props属性
2021/11/02 Vue.js