2013-07-30 100 views
0

我的JSON數據如下:道場數據網格插入圖像

"items": [ 
{ 
    "batch": "sectionA", 
    "full": "N", 
    "numStudents": 2, 
    "students": [ 
     { 
      "name": "John", 
      "married": "Y" 

     }, 
     { 
      "name": "Mary", 
      "married": "N" 
     } 
    ] 
}, 
{ 
    "batch": "sectionB", 
    "full": "Y", 
    "numStudents": 3, 
    "students": [ 
     { 
      "name": "John", 
      "married": "Y" 

     }, 
     { 
      "name": "Mary", 
      "married": "N" 
     }, 
     { 
      "name": "Sam", 
      "married": "N" 
     } 
    ] 
} 

]

我遍歷這個JSON和創建DataGrid其中:項[]批次是頁眉柱。 而項目[]。students []。name是該列下的行。這個JSON將產生一個包含2個標題列和3行的DataGrid。第1列(「SectionA」)只有兩個單元格在其下面填充。第2欄(「SectionB」)填充了3個單元格。

我可以在沒有任何問題的網格中顯示它。但我需要添加邏輯,如果:item []。students []。married =「Y」,那麼我必須在單元格中的學生名稱旁邊顯示一個小圖像。

同樣,如果item []。full =「Y」,那麼我必須以不同的顏色顯示標題欄。

有什麼建議嗎?這一直嚼我的大腦最近

回答

0

我已經通過改變用於電網的結構處理在數據網格道場圖像。類似下面的代碼片段。這還允許您將網格列的大小設置爲您正在使用的圖像文件的大小。

var marryflag; 

(function() { 
mygrid.list.structure = [  
{ 
    cells: [ 
       [ 
       {name: 'Married', width: '17%', field: "married",hidden: true, 
        formatter: function(inValue) { 
         marryflag = inValue; 
        } // end formatter function 
       }, 
       {name: 'Name', width: '20px', field: "name",       
        formatter: function(inValue) { 
         this.customStyles.push("vertical-align:middle"); 
         return "<img src=\"/url_path_to_image/" + inValue + "\" alt=\"" + inValue + "\" width=\"16px\" height=\"16px\" style=\"vertical-align: middle\" /> ";       
        }      
       } 
       ] 
      ] 
     }                                         
]; 
})();