首頁 >web前端 >js教程 >JavaScript- Json物件扁平化

JavaScript- Json物件扁平化

高洛峰
高洛峰原創
2016-11-25 14:15:041611瀏覽

引子:

在Asp.net mvc 框架下用Ajax方法提交一個複雜的Json 物件到Action方法上, 會出現一些問題,這裡我們用Javascript 的方式去解決這個問題,在asp.net mvc 3.0 後可以使用JsonValueProviderFactory解決這個問題,但在這裡我們給出用純js解決這個問題的方案,在mvc 2.0的老系統也可以使用這種方法。

需要提交一個複雜物件如以下物件結構:

 1 { 

 2 hotelName:'abc', 

 3 hotelAddress:' 北京海淀路72號'

 3 hotelAddress:' 北京海淀路72號'

 3 hotelAddress:' 北京海淀路72號',room ‘轉換成如下格式才能正確提交到後台Action的對像上。

收到720}, 

15 Rooms[1]: {roomName:豪華間,roomPrice:1020}, 

16 HotelStar:4 

17 } 

18 // 格式轉換碼{

21 _jsonFlat:function (data, parentPro, returnObj) { 

22      if (data instanceof Object) { 

23 for (varpro in )instanceof Object) { 

23 for (varpro in )instanceof        try{ 

25                     varproValue = eval("data. " +pro.toString()); 

26                    if(proValueValue c       for (var i = 0; i

28               vert ._jsonFlat(proValue[i], parentPro + "." + pro + "["+ i + "]", returnObj); 

30 } 

31    else 

32                              + "[" + i + "]",returnObj);  

33                         } 

34                         continue; 

35                     } 

36                     if(proValue instanceof Object) { 

37                         if(parentPro) 

38                            Convert._jsonFlat (proValue, parentPro + "."+ pro, returnObj); 

39                                中位。_jsonFlat(proValue, pro, 1.Obj); 

41     continue; 

43                     } 

🎠 ) 

45                         returnObj[parentPro + "." + pro   其他 

47                                } 

50                 catch(e) { } 

52             返回; 

53         }         returnObj[parentPro] = 數據; 

56     },jsonFlat: function(data) { 

57   器; 

58         if(data && data instanceof Object) {

59             varretObj = {}; 

60             Convert._jsonFlat(data, null, retObj); 

61             returnretObj; 

62         } 

63         返回null ; 

64     }, 

65 } 

解釋:以上程式碼就是完成Json物件格式的轉換,而只有透過轉換後的複雜Json物件才能提交至後台的Action方法。 JsonFloat方法利用中繼處理json物件上的所有屬性進行紙張化轉換。

呼叫範例

查看源碼?

1     $.ajax({

2       url: "controller/action",

3       data:Convert.jsonFlat({/ 3       data:Convert.jsonFlata({/ 4) : function(){

5         $(this).addClass("done");

6       }

7     }Provid;擦拭化了:

但是這裡需要注意contentType必需設定成application/json.

view sourceprint?

$.ajax({

  url: "controller/action", b

  url: "controller/action",

  url: "controller/action",

data:{n/ 資料*/},

  contentType: "application/json",

  success: function(){

    $(this).addClass("done" );

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn