c#和Javascript操作同一json对象的实现代码


Posted in Javascript onJanuary 17, 2012

能否让客户端和服务端操作同一json对象呢?目前想到的方式是通过客户端隐藏控件来实现。
以下是一个泛型列表对象 List<TrainingImplement> ,转为json后,客户端和服务端如何操作
1、json对象与C#泛型相互转换代码

//将json数据转换为泛型 
public static T ConvertByteDataToObject<T>(string byteData) 
{ 
T obj; 
using (var ms = new MemoryStream(Encoding.UTF8.GetBytes(byteData))) 
{ 
var serializer = new DataContractJsonSerializer(typeof(T)); 
obj = (T)serializer.ReadObject(ms); 
} 
return obj; 
} 
//将泛型转换为json 
public static string ConvertObjectToByteData<T>(T obj) 
{ 
string result; 
using (var ms = new MemoryStream()) 
{ 
var serializer = new DataContractJsonSerializer(typeof(T)); 
serializer.WriteObject(ms, obj); 
ms.Position = 0; 
result = Encoding.UTF8.GetString(ms.ToArray()); 
} 
return result; 
}

2、json数据源存入在客户端隐藏控件中
<input type="hidden" id="hideDataSource" runat="server" />

3、注意隐藏控件放json数据后,因为包含"/",会使request请示发生错误,所以页头请设置ValidateRequest="false"
<%@ Page Language="C#" ValidateRequest="false" AutoEventWireup="true"

4、页面加载Page_Load时,初始化json数据源
protected void Page_Load(object sender, EventArgs e) 
{ 
#region 加载数据源 
if (!IsPostBack) 
{ 
List<TrainingImplement> list= new List<TrainingImplement> (){ 
new TrainingImplement (){ 
Code="aaa", 
c_name ="bbb" 
} 
.... 
}//初始化数据源 
hideDataSource.Value = ConvertObjectToByteData(list); 
} 
else 
{ 
//如果是回传,数据源从客户端读取 
List<TrainingImplement> list = ConvertByteDataToObject<List<TrainingImplement>>(hideDataSource.Value); 
hideDataSource.Value = ConvertObjectToByteData(list); 
} 
#endregion

4、客户端js操作json数据源示例
<script type="text/javascript" src="../Scripts/jquery-1.4.3.js"></script> 
<script type="text/javascript" src="../Scripts/jquery-ui-1.8.7.custom.min.js"></script> 
<script type="text/javascript" src="../Scripts/jquery.json-2.2.min.js"></script> 
<script type ="text/javascript" > 
var DataSourceHidName = "hideDataSource"; 
var dataSourceDom; 
var dataSourceJson; 
$(document).ready 
(function () { 
//获取数据源 
dataSourceDom = document.getElementById(DataSourceHidName); 
dataSourceJson = eval("(" + dataSourceDom.value + ")"); 
}); 
//修改第1个TrainingImplement对象的Code值示例方法 
function ModifiedCode() { 
dataSourceJson[0]._code = "Code001"; 
//将更新值后的json对象重新写入隐藏控件中 
dataSourceDom.value = $.toJSON(dataSourceJson); 
} 
</script>

5、服务端C#操作Json数据源
List<TrainingImplement> list = ConvertByteDataToObject<List<TrainingImplement>>(hideDataSource.Value);
Javascript 相关文章推荐
javascript new一个对象的实质
Jan 07 Javascript
jquery中的sortable排序之后的保存状态的解决方法
Jan 28 Javascript
jQuery数组处理方法汇总
Jun 20 Javascript
js之onload事件的一点使用心得
Aug 14 Javascript
JQuery+Ajax无刷新分页的实例代码
Feb 08 Javascript
js 判断js函数、变量是否存在的简单示例代码
Mar 04 Javascript
JavaScript中的getTimezoneOffset()方法使用详解
Jun 10 Javascript
JS实现中文汉字按拼音排序的方法
Oct 09 Javascript
Vue列表渲染的示例代码
Nov 01 Javascript
使用NestJS开发Node.js应用的方法
Dec 03 Javascript
JS实现前端动态分页码代码实例
Jun 02 Javascript
vue实现列表拖拽排序的功能
Nov 02 Javascript
深入理解JavaScript系列(12) 变量对象(Variable Object)
Jan 16 #Javascript
Prototype源码浅析 Enumerable部分之each方法
Jan 16 #Javascript
javascript椭圆旋转相册实现代码
Jan 16 #Javascript
Prototype源码浅析 Number部分
Jan 16 #Javascript
Prototype源码浅析 String部分(四)之补充
Jan 16 #Javascript
Prototype源码浅析 String部分(二)
Jan 16 #Javascript
深入理解JavaScript系列(11) 执行上下文(Execution Contexts)
Jan 15 #Javascript
You might like
php,不用COM,生成excel文件
2006/10/09 PHP
PHP 身份验证方面的函数
2009/10/11 PHP
php判断是否为json格式的方法
2014/03/04 PHP
常用的JavaScript验证正则表达式汇总
2013/11/26 Javascript
jquery实现文本框数量加减功能的例子分享
2014/05/10 Javascript
教你如何使用node.js制作代理服务器
2014/11/26 Javascript
node.js中的fs.openSync方法使用说明
2014/12/17 Javascript
轻松创建nodejs服务器(6):作出响应
2014/12/18 NodeJs
javascript中scrollTop详解
2015/04/13 Javascript
JavaScript中对DOM节点的访问、创建、修改、删除
2015/11/16 Javascript
js 上传文件预览的简单实例
2016/08/16 Javascript
jquery实现一个全局计时器(商城可用)
2017/06/30 jQuery
Vue学习笔记进阶篇之函数化组件解析
2017/07/21 Javascript
postman+json+springmvc测试批量添加实例
2018/03/31 Javascript
vuejs实现ready函数加载完之后执行某个函数的方法
2018/08/31 Javascript
JavaScript实现的拼图算法分析
2019/02/13 Javascript
node微信开发之获取access_token+自定义菜单
2019/03/17 Javascript
vue.js表单验证插件(vee-validate)的使用教程详解
2019/05/23 Javascript
js原生map实现的方法总结
2020/01/19 Javascript
jquery更改元素属性attr()方法操作示例
2020/05/22 jQuery
nuxt.js服务端渲染中axios和proxy代理的配置操作
2020/11/06 Javascript
python实现图片批量剪切示例
2014/03/25 Python
Python中几个比较常见的名词解释
2015/07/04 Python
Python Flask前后端Ajax交互的方法示例
2018/07/31 Python
Python企业编码生成系统总体系统设计概述
2019/07/26 Python
Django中create和save方法的不同
2019/08/13 Python
关于Numpy中的行向量和列向量详解
2019/11/30 Python
python__new__内置静态方法使用解析
2020/01/07 Python
pytorch程序异常后删除占用的显存操作
2020/01/13 Python
自荐书范文范例
2014/02/13 职场文书
学校门卫岗位职责
2014/03/16 职场文书
奥巴马开学演讲稿
2014/05/15 职场文书
六年级小学生评语
2014/12/26 职场文书
南京大屠杀观后感
2015/06/02 职场文书
交通处罚决定书
2015/06/24 职场文书
医院保洁员管理制度
2015/08/05 职场文书