This is a migrated thread and some comments may be shown as answers.

[Solved] Locked property is not working with column template in kendo grid

4 Answers 516 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Kanchan asked on 02 Mar 2015, 07:07 AM

Locked property is not working with column template property in kendo grid. If I write locked:true for a column and use column template then grid is not rendering only header row of column is displaying. Columns array of grid option is given below:

01.{field: 'CHECKBOX', hidden:true, footerTemplate:'', locked:true,

02. template: function(dataItem){

03. if(dataItem.CHECKBOX){ return '<input type="checkbox" class="checkbox" ng-click="onClick($event)" />';}

04. else{ return '';}

05. },

06. headerTemplate:'<input type="checkbox" id="headerCheckbox" ng-click="onClickAllChkBox($event)"/>', sortable: false, width: '2%', reorderable: false},

07. {field:'name',headerTemplate:' NAME ', reorderable: false, footerTemplate:'合計', width: '2%', locked:true,

08. template: function(dataItem){

09. if(dataItem.name)

10. {return '<div ng-dblclick="settingGridDblClickEventHandler($event)">'+ dataItem.name+'</div>';}

11. else

12. {return '<div></div>';}

13.

14. }},

15. {field: 'age', title: 'AGE', footerTemplate:' ', width: '8%',

16. template: function(dataItem){

17. if(dataItem.age)

18. {return '<div ng-dblclick="settingGridDblClickEventHandler($event)">'+ dataItem.age+'</div>';}

19. else

20. {return '<div></div>';}

21.

22. }},

23. {field: 'phone', headerTemplate:' PHONE',width: '2%', footerTemplate:'',

24. template: function(dataItem){

25. if(dataItem.phone){ return '<a ng-click="customCellClickEventHandler($event)"><div class="tel-image"></div></a>';}

26. else{ return '';}

27. }

28. }

4 Answers, 1 is accepted

answered on 10 Mar 2015, 10:07 AM

Locked is not working. My grid option are given below-

sortable: true,

reorderable: true,

selectable:true,

scrollable:{

virtual: true

},

resizable: true,

columns: [

{field: 'CHECKBOX', hidden:true, footerTemplate:'', template: '<input type="checkbox" class="checkbox" ng-click="onClick($event)" />',

headerTemplate:'<input type="checkbox" id="headerCheckbox" ng-click="onClickAllChkBox($event)"/>', sortable: false, width: '2%', reorderable: false},

{field:'CLASSIFICATION',headerTemplate:' 種 <br> 別 ', reorderable: false, footerTemplate:'合計', width: '2%', template: '<div ng-dblclick="settingGridDblClickEventHandler($event)">#=CLASSIFICATION#</div>'},

{field: 'KANA', title: '顧客名', reorderable: false, footerTemplate:' ', width: '8%', template: '<div ng-dblclick="settingGridDblClickEventHandler($event)">#=KANA#</div>'},

{field: 'PHONE', headerTemplate:' 電 <br> 話', reorderable: false, sortable: false, width: '2%', footerTemplate:'', template: '<a ng-click="customCellClickEventHandler($event)"><div class="tel-image"></div></a>'},

{field: 'COMP', title: ' ｺﾝ <br> ﾌﾟﾗ ', reorderable: false, footerTemplate:'', width: '4%', template: '<div ng-dblclick="settingGridDblClickEventHandler($event)">#=COMP#</div>'},

{field: 'ACCOUNT', title: '口座番号', width: '8%', template: '<div ng-dblclick="settingGridDblClickEventHandler($event)">#=ACCOUNT#</div>'},

{field: 'SYOSAI', title: '商品/案件詳細', width: '13%', template: '<div ng-dblclick="settingGridDblClickEventHandler($event)">#=SYOSAI#</div>'},

{field: 'START_DATETIME', title: '提案日', width: '7%', template: '<div ng-dblclick="settingGridDblClickEventHandler($event)">#=START_DATETIME#</div>'},

{field: 'ASSETS', title: '想定数量(万円）', aggregates:['sum'], footerTemplate:' #: data.ASSETS ? sum: 0 #', width: '7%', template: '<div ng-dblclick="settingGridDblClickEventHandler($event)">#=ASSETS#</div>'},

{field: 'INCOME', title: '想定COM(万円）', aggregates:['sum'],footerTemplate:' #: data.INCOME ? sum: 0 #', width: '7%', template: '<div ng-dblclick="settingGridDblClickEventHandler($event)">#=INCOME#</div>'}

Please give the answer why the locked is not working with this grid option?

Thanks in advance.