json学习总结（2）
JSON进阶六-自动组装
现在很流行自动组装啊，为什么前台不行那？小弟不才也来个自动组装。
示例如下：
您可以看到，上述HTML中，我用红色标记出来的type为list，它代表了一个子集合。同时大家也应该看到我用绿色标记出来的地方（name="Score.Chinese"），它在JSON中表示：{Score:{Chinese:""}} 也就是说JsonSerializer不仅支持list还能够支持对象的对象，蓝色标记的Template属性是在反向绑定时使用的（表示要克隆行模板，是一个‘#’+ID）。同时您也应该看到了黄色标记的msg了把，对了这个就是验证提示信息（如果有特殊的需要，可以重写JsonSerializer.Message()），在看看深红色标记的dataType表示验证数据类型，而验证的代码使用的是Validator这个JSON，您可以按自己需求扩充，详情可以参考下面的JS示例代码。
function AddStudent() {
// 找到template下的DIV既template1（行模板）
var template = $("#template").children("div").clone();
$("#Stus").append(template);
}
function GetJson() {
var json = JsonSerializer.TableToJson("#tab1");
if (JsonSerializer.IsAllow) {
$.ajax({
type: "POST",
url: '<%= Request.Url.AbsolutePath %>',
data: "tabs=" + json,
success: function(msg) {
alert(msg);
}
});
}
}
// 删除学生信息（行）
function DelStudent(obj) {
$(obj).parent("samp").parent("div").remove();
}
$(document).ready(
function() {
// 后台价值来的JSON数组结构的字符串，当然可以说从数据库查询而得，我这里是写死的。
var json = JSON2.parse('<%= this.json %>');
// 绑定前台ID为tab1的结构中。
JsonSerializer.JsonToTab("#tab1", json);
// 重写验证类，len是对班级名做验证，text是对简介做验证，您可以通知扩充满足自己的需求
$.extend(Validator, {
len: function(data) {
var reg = new RegExp(/[0-9,a-z,A-Z]{6}/);
return reg.test(data);
},
text: function(date) {
return date && date.length < 1000;
}
});
}
);
可以看出除添加和删除动态行外，JSON的提取和绑定的代码是非常简单。
public partial class ExampleTwo : System.Web.UI.Page
{
public string json = "[{\"Name\":\"T31611\",\"Student\":[{\"ID\":1,\"Name\":\"张三\",\"Sex\":1,\"Score\":"
+"{\"Chinese\":33,\"Math\":44,\"English\":55}},{\"ID\":2,\"Name\":\"李四\",\"Sex\":2,"
+"\"Score\":{\"Chinese\":55,\"Math\":66,\"English\":77}},{\"ID\":3,\"Name\":\"杨大\","
+"\"Sex\":1,\"Score\":{\"Chinese\":100,\"Math\":100,\"English\":100}}],\"About\":\"这"
+"个是反序列化的JSON绑定。\"}]";
protected void Page_Load(object sender, EventArgs e)
{
if (!String.IsNullOrEmpty(Request["tabs"]))
{
List<Class> cls = Request["tabs"].DeJSON<List<Class>>();
Response.Write(cls.ToJSON());
Response.End();
}
}
}
public class Class {
public string Name;
public string About;
public List<Student> Student;
}
public class Student {
public int ID;
public string Name;
public int Sex;
public Score Score;
}
public class Score {
public decimal Chinese;
public decimal Math;
public decimal English;
}
using System.Collections.Generic;
using System.Web.Script.Serialization;
// Json序列化反序列化代码。
public static class Json
{
/// <summary>
/// JSON序列化
/// </summary>
/// <param name="obj"></param>
/// <returns>JSON格式的字符串，或者JSON数组格式的字符串</returns>
public static string ToJSON(this object obj)
{
JavaScriptSerializer serializer = new JavaScriptSerializer();
var st = serializer.Serialize(obj);
return st;
}
/// <summary>
/// JSON反序列化
/// </summary>
/// <param name="T">反序列化成什么对象例如：hashtable</typeparam>
/// <param name="json">json格式的字符串，包括json数组格式的字符串"[{"key":"0"},{"key":"1"}]"</param>
/// <returns>指定泛型对象</returns>
public static T DeJSON(this string json)
{
JavaScriptSerializer serializer = new JavaScriptSerializer();
return serializer.Deserialize(json);
}
}
小弟最近很迷恋JSON，以至于俺媳妇也吃起JSON的醋来（开个玩笑，呵呵）。至于小弟举的例子算不算面向切面（AOP），仁者见仁，智者见智。只是小弟对JSON的一种使用小技巧。
我可能使用AJAX，然后从后台调用一段数据，该数据可能是JSON格式的。
例如:{name:"张三",sex:1}
好了我们需要做的就是把sex转换成中文，当然你可以选择在后台处理，当然我们也会选择在前台完成？
当我们把数据一个一个放进对应的位置事，我们一般会这样做。
var json = {name:"张三",sex:1};
for(var f in json){
if (f == “sex”){
document.getElementById(f).value = josn[f] == 1 ? "男" : "女";
} else {
document.getElementById(f).value = josn[f];
}
}
for(var f in json){
if (f == “sex”){
document.getElementById(f).value = josn[f] == 1 ? "男" : "女";
} else {
document.getElementById(f).value = josn[f];
}
}
如果在来一个证件类型什么的，是不是我们还要在判断一次？
在来N个，我们是不是用Switch?
不～我们选择更好的方式。
var jsonEnum = {
sex: function(val){
var a = val == 1 ? "男" : "女";
return a;
},
idType: function(val){
var a = null;
switch(val){
..
}
}
};
var jsonBean = {
json:NaN,
Get: function(key){
if (jsonEnum[key]){
return jsonEnum[key](this.json[key]);
}
else {
return this.json[key];
}
}
};
var json = {name:"张三",sex:1,idType:1};
jsonBean.json = json;
for(var f in json){
alert(jsonBean.Get(f));
}
sex: function(val){
var a = val == 1 ? "男" : "女";
return a;
},
idType: function(val){
var a = null;
switch(val){
..}
}
};
var jsonBean = {
json:NaN,
Get: function(key){
if (jsonEnum[key]){
return jsonEnum[key](this.json[key]);
}
else {
return this.json[key];
}
}
};
var json = {name:"张三",sex:1,idType:1};
jsonBean.json = json;
for(var f in json){
alert(jsonBean.Get(f));
}
jsonBean我们姑且可以把这个东西看成类似于Spring的容器，同时把jsonEnum当成一个配置文件，以及可扩展的类？同样的我们是不是可以通过一定的方式，做数据验证，组合等等，只要我们有这样一个“容器”JSON。
浙公网安备 33010602011771号