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写的一个万年历(自写)
Jan 20 Javascript
jquery常用特效方法使用示例
Apr 25 Javascript
JS实现的3D拖拽翻页效果代码
Oct 31 Javascript
浅析函数声明和函数表达式——函数声明的声明提前
May 03 Javascript
Bootstrap打造一个左侧折叠菜单的系统模板(二)
May 17 Javascript
快速将Vue项目升级到webpack3的方法步骤
Sep 14 Javascript
Angular自定义组件实现数据双向数据绑定的实例
Dec 11 Javascript
如何使用puppet替换文件中的string
Dec 06 Javascript
vuex vue简单使用知识点总结
Aug 29 Javascript
Javascript操作select控件代码实例
Feb 14 Javascript
谈谈JavaScript中的函数
Sep 08 Javascript
详解Vue的七种传值方式
Feb 08 Vue.js
详解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函数in_array()使用详解
2014/08/20 PHP
PHP微信开发之有道翻译
2016/06/23 PHP
PHP学习笔记之session
2018/05/06 PHP
PHP中的self关键字详解
2019/06/23 PHP
jQuery boxy弹出层插件中文演示及使用讲解
2011/02/24 Javascript
javascript 函数声明与函数表达式的区别介绍
2013/10/05 Javascript
jquery统计用户选中的复选框的个数
2014/06/06 Javascript
js锁屏解屏通过对$.ajax进行封装实现
2014/07/31 Javascript
面向切面编程(AOP)的理解
2015/05/01 Javascript
Javascript监视变量变化的方法
2015/06/09 Javascript
JavaScript中使用指数方法Math.exp()的简介
2015/06/15 Javascript
JavaScript实现给定时间相加天数的方法
2016/01/25 Javascript
javascript实现标签切换代码示例
2016/05/22 Javascript
简单实现JS上传图片预览功能
2017/04/14 Javascript
深入理解NodeJS 多进程和集群
2018/10/17 NodeJs
Vue +WebSocket + WaveSurferJS 实现H5聊天对话交互的实例
2020/11/18 Vue.js
[01:18]PWL开团时刻DAY4——圣剑与抢盾
2020/11/03 DOTA
用python实现批量重命名文件的代码
2012/05/25 Python
在Python中marshal对象序列化的相关知识
2015/07/01 Python
Python实现简单的四则运算计算器
2016/11/02 Python
python用Pygal如何生成漂亮的SVG图像详解
2017/02/10 Python
Python使用re模块实现信息筛选的方法
2018/04/29 Python
Python使用add_subplot与subplot画子图操作示例
2018/06/01 Python
Pyinstaller 打包exe教程及问题解决
2019/08/16 Python
在python3中实现查找数组中最接近与某值的元素操作
2020/02/29 Python
儿童生日会策划方案
2014/05/15 职场文书
法人代表任命书范本
2014/06/05 职场文书
2014党员学习《反腐倡廉警示教育读本》思想汇报
2014/09/13 职场文书
2014年办公室工作总结范文
2014/11/12 职场文书
2014年企业党建工作总结
2014/12/18 职场文书
2015高三毕业寄语赠言
2015/02/27 职场文书
2015年纪念“卢沟桥事变”78周年活动方案
2015/05/06 职场文书
企业团队精神心得体会
2016/01/19 职场文书
解读MySQL的客户端和服务端协议
2021/05/10 MySQL
pytorch中的numel函数用法说明
2021/05/13 Python
MySQL 使用自定义变量进行查询优化
2021/05/14 MySQL