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 表格合并的问题分享
Sep 17 Javascript
js去字符串前后空格5种实现方法及比较
Apr 03 Javascript
简单的js图片轮换代码(js图片轮播)
May 06 Javascript
JavaScript运动减速效果实例分析
Aug 04 Javascript
javascript html实现网页版日历代码
Mar 08 Javascript
js实现可控制左右方向的无缝滚动效果
May 29 Javascript
微信小程序 获取相册照片实例详解
Nov 16 Javascript
element-ui 表格实现单元格可编辑的示例
Feb 26 Javascript
详解Js里的for…in和for…of的用法
Mar 28 Javascript
浅析vue-cli3配置webpack-bundle-analyzer插件【推荐】
Oct 23 Javascript
解决vue init webpack 下载依赖卡住不动的问题
Nov 09 Javascript
Vue实现导入Excel功能步骤详解
Jul 03 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 防止单引号,双引号在接受页面转义
2008/07/10 PHP
php 分页类 扩展代码
2009/06/11 PHP
php使用socket post数据到其它web服务器的方法
2015/06/02 PHP
PHP后期静态绑定实例浅析
2018/12/21 PHP
Javascript WebSocket使用实例介绍(简明入门教程)
2014/04/16 Javascript
判断及设置浏览器全屏模式
2014/04/20 Javascript
jquery ztree实现下拉树形框使用到了json数据
2014/05/14 Javascript
浅谈jQuery.easyui的datebox格式化时间
2015/06/25 Javascript
jQuery实现带分组数据的Table表头排序实例分析
2015/11/24 Javascript
利用css+原生js制作简单的钟表
2020/04/07 Javascript
jQuery设置和获取select、checkbox、radio的选中值方法
2017/01/01 Javascript
jQuery开源组件BootstrapValidator使用详解
2017/06/29 jQuery
Vue在页面右上角实现可悬浮/隐藏的系统菜单
2018/05/04 Javascript
React 组件渲染和更新的实现代码示例
2019/02/21 Javascript
如何实现小程序tab栏下划线动画效果
2019/05/18 Javascript
Vue props中Object和Array设置默认值操作
2020/07/30 Javascript
解决Element中el-date-picker组件不回填的情况
2020/11/07 Javascript
Python3爬虫中识别图形验证码的实例讲解
2020/07/30 Python
纯CSS实现设置半个字符的样式
2014/07/03 HTML / CSS
CSS3实现淘宝留白的方法
2020/06/05 HTML / CSS
html5 canvas的绘制文本自动换行的示例代码
2018/09/17 HTML / CSS
旧时光糖果:Old Time Candy
2018/02/05 全球购物
Rag & Bone官网:瑞格布恩高级成衣
2018/04/19 全球购物
size?爱尔兰官方网站:英国伦敦的球鞋精品店
2019/03/31 全球购物
德国苹果商店:MacTrade
2020/05/18 全球购物
Wolford法国官网:奥地利奢侈内衣品牌
2020/08/11 全球购物
千元咖啡店的创业计划书范文
2013/12/29 职场文书
党性观念心得体会
2014/09/03 职场文书
2014年销售员工作总结
2014/12/01 职场文书
2014年优秀党员材料
2014/12/18 职场文书
十岁生日答谢词
2015/01/05 职场文书
2016寒假假期总结
2015/10/10 职场文书
电力培训学习心得体会
2016/01/11 职场文书
pytorch--之halfTensor的使用详解
2021/05/24 Python
国际最新研究在陨石中发现DNA主要成分 或由陨石带来地球
2022/04/29 数码科技
vue router 动态路由清除方式
2022/05/25 Vue.js