는 ExtJS는

Question

나는 다음과 같은 JSON을 반환하는 PHP 스크립트를 가지고

[ 
    { 
     "Code":0, 
     "Message":"No problem" 
    }, 
    { 
     "name":"o016561", 
     "status":1, 
     "locks":[ 
     { 
      "ztn":"155320", 
      "dtn":"20131111", 
      "idn":"78" 
     }, 
     { 
      "ztn":"155320", 
      "dtn":"20131111", 
      "idn":"91" 
     } 
     ] 
    }, 
    { 
     "name":"o011111", 
     "status":1, 
     "locks":[ 
     { 
      "ztn":"155320", 
      "dtn":"20131111", 
      "idn":"91" 
     } 
     ] 
    }, 
    { 
     "name":"o019999", 
     "status":0, 
     "locks":[ 

     ] 
    }, 
    { 
     "name":"o020000", 
     "status":0, 
     "locks":[ 

     ] 
    }, 
    { 
     "name":"o020001", 
     "status":0, 
     "locks":[ 

     ] 
    } 
] 

편집 :

:이 그리드 이런 식으로 뭔가를 찾아야한다

name과 status을 그리드에로드 할 수있었습니다. - 지금까지는 그렇게 좋았습니다. 그러나 더 중요한 부분은 내 격자에로드되는 locks 배열의 중첩 된 데이터가 필요하지만 코드를 작동시킬 수 없다는 것입니다. 어떤 도움을 주시면 감사하겠습니다.

중요한 경우 ExtJS 4.2를 사용하고 있습니다. 편집 2

:

나는

Ext.define("Locks", { 
    extend: 'Ext.data.Model', 
    fields: [ 
     'ztn', 
     'dtn', 
     'idn' 
    ] 
}); 

Ext.define("ConnectionModel", { 
    extend: 'Ext.data.Model', 
    fields: ['name', 'status'], 
    hasMany: [{ 
     model: 'Locks', 
     name: 'locks' 
    }] 
}); 

var store = Ext.create('Ext.data.Store', { 
    model: "ConnectionModel", 
    autoLoad: true, 
    proxy: { 
     type: 'ajax', 
     reader: { 
      type: 'json', 
      root: 'name' 
     } 
    } 
}); 

을 시도하지만 ... 을 여러 가지 방법으로 잘못 될 듯 ztn 및 dtn가 표시 단지로 구분 될 수 있다면 좋지 않을까 같은 열의 공백

Answer 1

renderer을 열에 추가 할 수 있습니다. 그 렌더러에서 당신은 여기

는 작업 바이올린의 ... 기록으로 아무것도 할 수 http://jsfiddle.net/Vandeplas/MWeGa/3/

Ext.create('Ext.grid.Panel', { 
    title: 'test', 
    store: store, 
    columns: [{ 
     text: 'Name', 
     dataIndex: 'name' 
    }, { 
     text: 'Status', 
     dataIndex: 'status' 
    }, { 
     text: 'idn', 
     renderer: function (value, metaData, record, rowIdx, colIdx, store, view) { 
      values = []; 
      record.locks().each(function(lock){ 
       values.push(lock.get('idn')); 
      }); 
      return values.join('<br\>'); 
     } 
    }, { 
     text: 'ztn + dtn', 
     renderer: function (value, metaData, record, rowIdx, colIdx, store, view) { 
      values = []; 
      record.locks().each(function(lock){ 
       values.push(lock.get('ztn') + ' ' + lock.get('dtn')); 
      }); 
      return values.join('<br\>'); 
     } 
    }], 
    height: 200, 
    width: 600, 
    renderTo: Ext.getBody() 
}); 

주

당신이 당신의 백엔드를 제어 할 수 있다면 당신은 더 나은 형태를 변경 귀하의 데이터 중 다음과 같이 더 많이 입력하십시오 :

{ 
    "code": 0, 
    "message": "No problem", 
    "success": true, 
    "data": [ 
     { 
      "name": "o016561", 
      "status": 1, 
      "locks": [ 
       { 
        "ztn": "155320", 
        "dtn": "20131111", 
        "idn": "78" 
       }, 
       { 
        "ztn": "155320", 
        "dtn": "20131111", 
        "idn": "91" 
       } 
      ] 
     }, 
     { 
      "name": "o011111", 
      "status": 1, 
      "locks": [ 
       { 
        "ztn": "155320", 
        "dtn": "20131111", 
        "idn": "91" 
       } 
      ] 
     } 
    ] 
} 

그런 식으로 제어 데이터 (성공, 메시지, 코드 등)를 데이터와 혼합하면 프록시가 올바르게 선택합니다 (경험 한 문제의 원인 일 수 있음). 나는 성공 boolean => Ext를 추가하여 실패 처리기로 간다. 예외 처리시 많은 도움이됩니다.

proxy: { 
    type: 'ajax', 
     api: { 
     read: ___URL____ 
    }, 
    reader: { 
     type: 'json', 
     root: 'data', 
     messageProperty: 'message' 
    } 
}