2012-11-05 4 views
0

내 프로젝트에 KendoUI Grid를 사용하려고합니다. 그리드에 바인딩하려는 데이터 소스에는 열과 몇 가지 다른 옵션을 추가로 많이 갖고 있습니다. 나는 자바 스크립트에서 그리드에 대한 옵션을 설정할 수있는 방법이 있는지 궁금 해서요,하지만 '데이터'옵션을 시도 할 때 문제가있는 것 같습니다.KendoUI Grid 할당 옵션

<div data-bind="kendoGrid: $parent.kendoGrid"></div> 


.... 
program = ko.observable(null), 
kendoGrid = { data: program.BettingInterest, sortable: true, columnMenu: true, 
      columns: [{ field: 'BettingInterestProgramNumber', title: 'Post' }, 
       { field: 'PostPosition', title: 'PP' }, { field: 'MLOdd', title: 'ML' }, 
       { field: 'FractionalOdd', title: 'Odds' }, 'Jockey', 'Trainer', 'Owner', 
       { field: 'WeightCarried', title: 'Weight' }, { field: 'Medication', title: 'Med' }, 
       { field: 'ClaimingPrice', title: 'Claiming' }, 'Breed'], 
      scrollable: false, resizable: true 
     }, 
.... 

'프로그램이'캐스 케이 딩 드롭 다운 내 그리드의 일련의 마지막 후 채워집니다하면 열 및하지만 실제 데이터로 보여줍니다. 그냥 간단한 무언가가 누락 된 경우 궁금하네요 ...

+0

당신이 program'이 채워집니다 방법'보여줄 수 귀하의 뷰 모델은 같을까요? 그 속성이'program' observable에 없을 때'program.BettingInterest'에 그리드를 바인딩 할 수있을 지 확신하지 못합니다. 또한'program'을 채운 후에 그리드에서'.refresh()'를 호출 해 볼 수도 있습니다. http://docs.kendoui.com/api/web/grid#refresh – CodingWithSpike

답변

2

바인딩을 사용하여이 속성을 사용하려면 종속성을 올바르게 추적 할 수 있도록 현재 프로그램의 BettingInterest를 나타내는 계산을 만들어야합니다. 여기

var ViewModel = function() { 
    this.program = ko.observable(); 
    this.programBettingInterest = ko.computed(function() { 
     var program = this.program(); 
     return program ? program.BettingInterest : [];   
    }, this); 

    this.myGrid = { data: this.programBettingInterest, sortable: true, columnMenu: true, 
     columns: [{ field: 'propA', title: 'propertyA' }, 
      { field: 'propB', title: 'propertyB' }], 
     scrollable: false, resizable: true 
    }; 
}; 

샘플 : http://jsfiddle.net/rniemeyer/eqVWs/

+0

좋습니다! 나는 KendoUI를 사용하지 않을 때 비슷한 점이 있었기 때문에 그 점을 생각하지 않으면 바보가된다. – Zholen