父子窗体间传递JSON格式的数据的代码


Posted in Javascript onDecember 25, 2010

如果某个一级评分项包含评分子项,则点击该评分项时,再弹出一个新窗口,新窗体中列出了当前评分项的所有评分子项列表,供用户进行操作。用户操作完成后,点击“确定”按钮,则返回到父窗体,在子窗体中所有的操作结果,同时要带到父窗体中。同时,如果用户再次点击该评分项,则在弹出子窗体的同时,要将上次操作的结果绑定到对应的操作项上。

上面描述的例子,就涉及到了一个父子窗体间的数据传递。如何实现这一数据传递,当然有很多方法。这里只是记录一下在这个例子中我使用的方法。我的方法是在子窗体点击“确定”按钮时,将操作结果构造成json格式的字符串,通过调用父窗体上的方法:opener.方法(),将json格式数据传递到父窗体上。

此例中构造的json数据类似如下格式:

{"MyData":[

{"bh":"111","lx":"1","df":"10","bz":"aaa"},

{"bh":"112","lx":"2","df":"20","bz":"bbb"},

{"bh":"113","lx":"2","df":"30","bz":"ccc"}

]}

此处子项打分需要保持的分别是bh:编号;lx:类型;df:得分;bz:备注。

按照自己的需要,可以再自己增加需要保持的项。构造此json数据可以放在前台,也可以放在后台。

在此例中,我是放置后台的。代码如下:

StringBuilder jsonBuilder = new StringBuilder(); 
jsonBuilder.Append("@{\""); 
jsonBuilder.Append("MyData"); 
jsonBuilder.Append("\":["); int k = bh.Split(',').Length + 1; 
for (int i = 0; i < bh.Split(',').Length; i++) 
{ 
tem += "update KH_PFX set DF = '"+EncriptLib.EncriptLib.EncodeCode(Convert.ToDouble(df.Split(',')[i].ToString().Trim()))+"',"; 
tem += "BZ = '"+bz.Split(',')[i].ToString().Trim()+"',PFRXM = '"+Session["XM"].ToString()+"',"; 
tem += "PFRBH = '"+Session["YHBH"].ToString()+"',PFRQ = to_date('"+DateTime.Now.ToShortDateString()+"','yyyy-MM-dd')"; 
tem += " where BH = '"+bh.Split(',')[i].ToString().Trim()+"'"; 
tem += "?e"; //此处用此特殊的符号来分隔sql语句 
jsonBuilder.Append("{\"bh\":" + "\"" + bh.Split(',')[i].ToString().Trim() + "\"" + ","); 
jsonBuilder.Append("\"lx\":" + "\"" + lx.Split(',')[i].ToString().Trim() + "\"" + ","); 
jsonBuilder.Append("\"df\":" + "\"" + df.Split(',')[i].ToString().Trim() + "\"" + ","); 
jsonBuilder.Append("\"bz\":" + "\"" + bz.Split(',')[i].ToString().Trim() + "\"" + "},"); 
} 
if(tem != "") 
{ 
jsonBuilder.Remove(jsonBuilder.Length - 1, 1); 
jsonBuilder.Append("]"); 
jsonBuilder.Append("}"); 
Page.ClientScript.RegisterClientScriptBlock(GetType(), "cg", "<Script>window.close();opener.GetZXDF('zxdf" + Request.QueryString["bh"].ToString() + "','" + parent_df.Text.Trim() + "','" + jsonBuilder.ToString() + "',\"" + tem + "\");</Script>"); 
}

"@"符号可以防止在jsonBuilder.ToString()后,转义字符“\”的消失。

调用父窗体的GetZXDF()方法,将json数据传递给父窗体。

下面给出子窗体加载时,绑定json数据的代码

$(function() { //加载时获取json,然后绑定打分结果 
var obj = opener.GetJson($("#txt_YCBH").val()); 
if($.trim(obj) != ""){ 
obj = "(" + obj + ")"; 
obj = eval(obj); 
var data = obj.MyData; 
$.each(data, function(i, n) { 
if(n.lx == "1"){ 
//直接打分类的绑定 
$("#lx" + n.bh).siblings("input").eq(0).val(n.df); 
$("#lx" + n.bh).siblings("input").eq(1).val(n.df); 
$("#lx" + n.bh).parent().parent().next().children().children("textarea").val(n.bz); 
} 
if(n.lx == "2"){ 
//选项打分类的绑定 
$("#lx" + n.bh).siblings("input:text").eq(1).val(n.df); 
$("#lx" + n.bh).siblings("input:checkbox").each(function(){ 
if($.trim($(this).val()) == $.trim(n.df)){ 
$(this).attr("checked",true); 
} 
}); 
$("#lx" + n.bh).parent().parent().parent().next().children().children("textarea").val(n.bz); 
} 
});

opener.GetJson()方法是父窗体上用来向子窗体传递json数据的方法,代码如下:
//通过编号获取对应评分项的子项打分结果的json字符串 
function GetJson(p_bh) 
{ 

 //$("#zxdf" + p_bh).siblings("input").eq(1).val()中保存的就是子窗体传递给父窗体的json数据 
return $("#zxdf" + p_bh).siblings("input").eq(1).val(); 
}
Javascript 相关文章推荐
jquery.tmpl JQuery模板插件
Oct 10 Javascript
js中对象的声明方式以及数组的一些用法示例
Dec 11 Javascript
js判断url是否有效的两种方法
Mar 04 Javascript
JavaScript使用DeviceOne开发实战(一) 配置和起步
Dec 01 Javascript
jQuery时间日期三级联动(推荐)
Nov 27 Javascript
js+div+css下拉导航菜单完整代码分享
Dec 28 Javascript
AngularJS 单选框及多选框的双向动态绑定
Apr 20 Javascript
babel的使用及安装配置教程
Feb 22 Javascript
vue-cli3.0 特性解读
Apr 22 Javascript
微信小程序template模板与component组件的区别和使用详解
May 22 Javascript
vue+canvas实现移动端手写签名
May 21 Javascript
js实现点击上传图片并设为模糊背景
Aug 02 Javascript
javascript自执行函数之伪命名空间封装法
Dec 25 #Javascript
Ext对基本类型的扩展 ext,extjs,format
Dec 25 #Javascript
JQuery live函数
Dec 24 #Javascript
jquery 单击li防止重复加载的实现代码
Dec 24 #Javascript
基于jquery的关于动态创建DOM元素的问题
Dec 24 #Javascript
在JavaScript中获取请求的URL参数
Dec 22 #Javascript
基于Jquery的表格隔行换色,移动换色,点击换色插件
Dec 22 #Javascript
You might like
用来解析.htgroup文件的PHP类
2012/09/05 PHP
JavaScript中函数声明优先于变量声明的实例分析
2012/03/01 Javascript
javascript作用域容易记错的两个地方分析
2012/06/22 Javascript
javascript object array方法使用详解
2012/12/03 Javascript
tangram框架响应式加载图片方法
2013/11/21 Javascript
js自定义鼠标右键的实现原理及源码
2014/06/23 Javascript
node.js中的fs.rmdir方法使用说明
2014/12/16 Javascript
JavaScript每天定时更换皮肤样式的方法
2015/07/01 Javascript
jQuery实现图片轮播效果代码(基于jquery.pack.js插件)
2016/06/02 Javascript
jQuery实现的tab标签切换效果示例
2016/09/05 Javascript
基本DOM节点操作
2017/01/17 Javascript
JavaScript手风琴页面制作
2017/05/17 Javascript
jquery实现图片放大点击切换
2017/06/06 jQuery
微信小程序组件 marquee实例详解
2017/06/23 Javascript
jquery 获取索引值在一定范围的列表方法
2018/01/25 jQuery
webpack打包node.js后端项目的方法
2018/03/10 Javascript
如何解决vue2.0下IE浏览器白屏问题
2018/09/13 Javascript
从零学python系列之教你如何根据图片生成字符画
2014/05/23 Python
Django 前后台的数据传递的方法
2017/08/08 Python
PyQt5+requests实现车票查询工具
2019/01/21 Python
Python中的正则表达式与JSON数据交换格式
2019/07/03 Python
Python尾递归优化实现代码及原理详解
2020/10/09 Python
python获取天气接口给指定微信好友发天气预报
2020/12/28 Python
欧洲高端品牌直销店:Fashionesta
2016/08/31 全球购物
日本面向世界,国际级的免税在线购物商城:DOKODEMO
2017/02/01 全球购物
德国在线订购鲜花:Fleurop
2018/08/25 全球购物
Dockers鞋官网:Dockers Shoes
2018/11/13 全球购物
欧洲最大的高尔夫零售商:American Golf
2019/09/02 全球购物
莫斯科的韩国化妆品店:Sifo
2019/12/04 全球购物
介绍一下.NET构架下remoting和webservice
2014/05/08 面试题
行政总经理岗位职责
2013/12/05 职场文书
计算机网络及管理学专业求职信
2014/06/05 职场文书
环境保护标语
2014/06/20 职场文书
贫民窟的百万富翁观后感
2015/06/09 职场文书
关于感恩的素材句子(38句)
2019/11/11 职场文书
用python实现监控视频人数统计
2021/05/21 Python