父子窗体间传递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学习笔记 nt-child的使用
Jan 17 Javascript
Node.js开发指南中的简单实例(mysql版)
Sep 17 Javascript
javascript实时显示北京时间的方法
Mar 12 Javascript
js实现图片无缝滚动
Dec 23 Javascript
JavaScript中的Array 对象(数组对象)
Jun 02 Javascript
JavaScript中的return布尔值的用法和原理解析
Aug 14 Javascript
Vue v2.5 调整和更新不完全问题
Oct 24 Javascript
微信小程序自定义select下拉选项框组件的实现代码
Aug 28 Javascript
JS实现瀑布流效果
Mar 07 Javascript
JavaScript冒泡算法原理与实现方法深入理解
Jun 04 Javascript
简单了解常用的JavaScript 库
Jul 16 Javascript
详解vue中v-for的key唯一性
May 15 Vue.js
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
PHP新手上路(十四)
2006/10/09 PHP
thinkphp的URL路由规则与配置实例
2014/11/26 PHP
javascript:void(0)的真正含义实例分析
2008/08/20 Javascript
javascript 写类方式之八
2009/07/05 Javascript
人人网javascript面试题 可以提前实现下
2012/01/05 Javascript
js 固定悬浮效果实现思路代码
2013/08/02 Javascript
简单谈谈jQuery(function(){})与(function(){})(jQuery)
2014/12/19 Javascript
跟我学习javascript的arguments对象
2015/11/16 Javascript
JavaScript基本类型值-Undefined、Null、Boolean
2017/02/23 Javascript
解决淘宝cnpm 安装后cnpm不是内部或外部命令的问题
2018/05/17 Javascript
详解vue-router数据加载与缓存使用总结
2018/10/29 Javascript
使用vue-cli4.0快速搭建一个项目的方法步骤
2019/12/04 Javascript
[01:31]完美与DOTA2历程
2014/07/31 DOTA
python下载图片实现方法(超简单)
2017/07/21 Python
Python字符编码与函数的基本使用方法
2017/09/30 Python
tensorflow没有output结点,存储成pb文件的例子
2020/01/04 Python
pycharm如何实现跨目录调用文件
2020/02/28 Python
windows+vscode安装paddleOCR运行环境的步骤
2020/11/11 Python
Django websocket原理及功能实现代码
2020/11/14 Python
Python实现Appium端口检测与释放的实现
2020/12/31 Python
爱尔兰领先的在线体育用品零售商:theGAAstore
2018/04/16 全球购物
英国婴儿产品专家:Samuel Johnston
2020/04/20 全球购物
SQL Server笔试题
2012/01/10 面试题
Ajax的工作原理
2015/12/04 面试题
应届毕业生应聘自荐信
2013/12/07 职场文书
四年级数学教学反思
2014/02/02 职场文书
优秀医生事迹材料
2014/02/12 职场文书
2014年教师党员公开承诺书
2014/05/28 职场文书
有关环保的标语
2014/06/13 职场文书
家属慰问信
2015/02/14 职场文书
努力学习保证书
2015/02/26 职场文书
中秋节主题班会
2015/08/14 职场文书
Java方法重载和方法重写的区别到底在哪?
2021/06/11 Java/Android
解决mysql的int型主键自增问题
2021/07/15 MySQL
星际争霸 Light vs Action 一场把教主看到鬼畜的比赛
2022/04/01 星际争霸
python使用pycharm安装pyqt5以及相关配置
2022/04/22 Python