父子窗体间传递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 相关文章推荐
javascript中的document.open()方法使用介绍
Oct 09 Javascript
javascript 数组操作详解
Jan 29 Javascript
JavaScript实现的伸展收缩型菜单代码
Oct 14 Javascript
JavaScript资源预加载组件和滑屏组件的使用推荐
Mar 10 Javascript
js中less常用的方法小结
Aug 09 Javascript
基于VUE.JS的移动端框架Mint UI的使用
Oct 11 Javascript
微信小程序模板和模块化用法实例分析
Nov 28 Javascript
vue使用element-ui的el-input监听不了回车事件的解决方法
Jan 12 Javascript
Vue实现美团app的影院推荐选座功能【推荐】
Aug 29 Javascript
vue两组件间值传递 $router.push实现方法
May 15 Javascript
VUE中V-IF条件判断改变元素的样式操作
Aug 09 Javascript
详解JavaScript类型判断的四种方法
Oct 21 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
一些PHP写的小东西
2006/12/06 PHP
PHP语言中global和$GLOBALS[]的分析 之二
2012/02/02 PHP
递归删除一个节点以及该节点下的所有节点示例
2014/03/19 PHP
PHP多种序列化/反序列化的方法详解
2017/06/23 PHP
PHP远程连接oracle数据库操作实现方法图文详解
2019/04/11 PHP
JQuery 选择器、过滤器介绍
2011/02/14 Javascript
Node.js安装教程和NPM包管理器使用详解
2014/08/16 Javascript
JS仿iGoogle自定义首页模块拖拽特效的方法
2015/02/13 Javascript
探究JavaScript函数式编程的乐趣
2015/12/14 Javascript
解决给dom元素绑定click等事件无效问题的方法
2017/02/17 Javascript
Angular.js组件之input mask对input输入进行格式化详解
2017/07/10 Javascript
浅谈vue项目重构技术要点和总结
2018/01/23 Javascript
Vue组件化开发思考
2018/02/02 Javascript
vue实现双向绑定和依赖收集遇到的坑
2018/11/29 Javascript
vue指令做滚动加载和监听等
2019/05/26 Javascript
原生JavaScript实现弹幕组件的示例代码
2020/10/12 Javascript
[01:07:02]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD BO3 第三场 2月26日
2021/03/11 DOTA
Python多线程编程(一):threading模块综述
2015/04/05 Python
Python爬虫获取整个站点中的所有外部链接代码示例
2017/12/26 Python
Python判断字符串是否为字母或者数字(浮点数)的多种方法
2018/08/03 Python
通过python将大量文件按修改时间分类的方法
2018/10/17 Python
DRF跨域后端解决之django-cors-headers的使用
2019/01/27 Python
Django框架ORM数据库操作实例详解
2019/11/07 Python
Python运行提示缺少模块问题解决方案
2020/04/02 Python
Pycharm如何导入python文件及解决报错问题
2020/05/10 Python
python 绘制场景热力图的示例
2020/09/23 Python
如何基于Python爬虫爬取美团酒店信息
2020/11/03 Python
celery在python爬虫中定时操作实例讲解
2020/11/27 Python
CSS3实现可爱的小黄人动画
2016/07/11 HTML / CSS
PHP中如何使用Cookie
2015/10/28 面试题
小学竞选班长演讲稿
2014/09/09 职场文书
个人投资合作协议书
2014/10/12 职场文书
2015年行政人事工作总结
2015/05/21 职场文书
2016应届毕业生自荐信范文
2016/01/28 职场文书
学习心得体会
2019/06/20 职场文书
python 标准库原理与用法详解之os.path篇
2021/10/24 Python