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 数组排序函数
Aug 20 Javascript
js获取IP和PcName(IE)在vs中可用
Aug 02 Javascript
window.location.href IE下跳转失效的解决方法
Mar 27 Javascript
JS面向对象基础讲解(工厂模式、构造函数模式、原型模式、混合模式、动态原型模式)
Aug 16 Javascript
js判断当前页面在移动设备还是在PC端中打开
Jan 06 Javascript
js实现九宫格的随机颜色跳转
Feb 19 Javascript
jQuery+pjax简单示例汇总
Apr 21 jQuery
js构造函数创建对象是否加new问题
Jan 22 Javascript
浅谈MUI框架中加载外部网页或服务器数据的方法
Jan 31 Javascript
vue实现行列转换的一种方法
Aug 06 Javascript
微信小程序实现打开并下载服务器上面的pdf文件到手机
Sep 20 Javascript
vue-router为激活的路由设置样式操作
Jul 18 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 将字符串按大写字母分隔成字符串数组
2010/04/30 PHP
CI(CodeIgniter)模型用法实例分析
2016/01/20 PHP
对比PHP对MySQL的缓冲查询和无缓冲查询
2016/07/01 PHP
php array_udiff_assoc 计算两个数组的差集实例
2016/11/12 PHP
PHP中仿制 ecshop验证码实例
2017/01/06 PHP
HTML 自动伸缩的表格Table js实现
2009/04/01 Javascript
B/S模式项目中常用的javascript汇总
2013/12/17 Javascript
JavaScript四种调用模式和this示例介绍
2014/01/02 Javascript
利用浏览器全屏api实现js全屏
2014/01/16 Javascript
js replace(a,b)之替换字符串中所有指定字符的方法
2016/08/17 Javascript
Javascript中的 “&amp;” 和 “|” 详解
2017/02/02 Javascript
js实现canvas图片与img图片的相互转换的示例
2017/08/31 Javascript
详解vue 数组和对象渲染问题
2018/09/21 Javascript
vue elementUI使用tabs与导航栏联动
2019/06/21 Javascript
jquery 键盘事件 keypress() keydown() keyup()用法总结
2019/10/23 jQuery
微信小程序实现单个或多个倒计时功能
2020/11/01 Javascript
Centos Python2 升级到Python3的简单实现
2016/06/21 Python
Numpy数组的保存与读取方法
2018/04/04 Python
详解python3中tkinter知识点
2018/06/21 Python
Python3获取拉勾网招聘信息的方法实例
2019/04/03 Python
扩展Django admin的list_filter()可使用范围方法
2019/08/21 Python
html5 offlline 缓存使用示例
2013/06/24 HTML / CSS
Ootori在线按摩椅店:一家专业的按摩椅制造商
2019/04/10 全球购物
Amara德国:家居饰品、设计师品牌和豪华礼品
2019/05/20 全球购物
跟单文员的岗位职责
2013/11/14 职场文书
公司前台接待岗位职责
2013/12/03 职场文书
户外亲子活动策划方案
2014/02/07 职场文书
书香校园建设方案
2014/05/02 职场文书
2014年大堂经理工作总结
2014/11/21 职场文书
法人代表资格证明书
2015/06/18 职场文书
党员干部学法用法心得体会
2016/01/21 职场文书
作文之亲情600字
2019/09/23 职场文书
Pytorch可视化的几种实现方法
2021/06/10 Python
JavaWeb 入门篇(3)ServletContext 详解 具体应用
2021/07/16 Java/Android
Redis高并发防止秒杀超卖实战源码解决方案
2021/11/01 Redis
Apache自带的ab压力测试工具的实现
2022/07/23 Servers