父子窗体间传递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检查日期格式的函数[比较全]
Oct 17 Javascript
jQuery及JS实现循环中暂停的方法
Feb 02 Javascript
jQuery原理系列-css选择器的简单实现
Jun 07 Javascript
数据结构中的各种排序方法小结(JS实现)
Jul 23 Javascript
javascript中的 object 和 function小结
Aug 14 Javascript
loading动画特效小结
Jan 22 Javascript
vue脚手架vue-cli的学习使用教程
Jun 06 Javascript
如何在js代码中消灭for循环实例详解
Jul 29 Javascript
vue-cli3搭建项目的详细步骤
Dec 05 Javascript
JavaScript之实现一个简单的Vue示例
Jan 17 Javascript
图文详解vue框架安装步骤
Feb 12 Javascript
vue中重定向redirect:‘/index‘,不显示问题、跳转出错的完美解决
Sep 28 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
Ajax+PHP 边学边练 之二 实例
2009/11/24 PHP
简单谈谈php中ob_flush和flush的区别
2014/11/27 PHP
php使用GD库创建图片缩略图的方法
2015/06/10 PHP
php 实现一个字符串加密解密的函数实例代码
2016/11/01 PHP
老生常谈PHP面向对象之命令模式(必看篇)
2017/05/24 PHP
zShowBox 图片放大展示jquery版 兼容性
2011/09/24 Javascript
JS 对输入框进行限制(常用的都有)
2013/07/30 Javascript
transport.js和jquery冲突问题的解决方法
2015/02/10 Javascript
JS+CSS实现的经典tab选项卡效果代码
2015/09/16 Javascript
js仿QQ中对联系人向左滑动、滑出删除按钮的操作
2016/04/07 Javascript
Bootstrap学习笔记之css组件(3)
2016/06/07 Javascript
浅谈JavaScript 中有关时间对象的方法
2016/08/15 Javascript
js监听键盘事件的方法_原生和jquery的区别详解
2016/10/10 Javascript
微信小程序(应用号)开发新闻客户端实例
2016/10/24 Javascript
vue.js事件处理器是什么
2017/03/20 Javascript
对vux点击事件的优化详解
2018/08/28 Javascript
vue简单封装axios插件和接口的统一管理操作示例
2020/02/02 Javascript
[01:04:20]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第一场 11.29
2020/12/02 DOTA
使用Python微信库itchat获得好友和群组已撤回的消息
2018/06/24 Python
Python绘制的二项分布概率图示例
2018/08/22 Python
详解Python用三种方式统计词频的方法
2019/07/29 Python
python不相等的两个字符串的 if 条件判断为True详解
2020/03/12 Python
Python如何将函数值赋给变量
2020/04/28 Python
浅谈keras中的后端backend及其相关函数(K.prod,K.cast)
2020/06/29 Python
浅谈Python 钉钉报警必备知识系统讲解
2020/08/17 Python
python 逆向爬虫正确调用 JAR 加密逻辑
2021/01/12 Python
大学生专业个人学习的自我评价
2013/10/26 职场文书
《手指教学》反思
2014/02/14 职场文书
班干部竞选演讲稿
2014/04/24 职场文书
大学生村官演讲稿
2014/04/25 职场文书
服务理念口号
2014/06/11 职场文书
2015法院个人工作总结范文
2015/05/25 职场文书
火烧圆明园观后感
2015/06/03 职场文书
使用Vue3+Vant组件实现App搜索历史记录功能(示例代码)
2021/06/09 Vue.js
叶县这家生产军用电台的兵工厂,人称“四机部”,走出一上将
2022/02/18 无线电
Java生成日期时间存入Mysql数据库的实现方法
2022/03/03 Java/Android