아래 사용 예가 best 는 아닐 수 있으며, 실제 동작 하는 코드에 대한 참고용으로 사용하시면 될 것 같습니다.
생각 보다 ExtJS 의 경우 버전 별로 API 가 좀 다르기도 하고 요구하는 기능에 대한 API 문서가 정말 자세히 나와 있지도 않아 노가다를 많이 하게 되니 동작 하는 코드만으로도 다양하게 적용 가능 할 것으로 판단 됩니다.
columnArr[0] = Ext.create("Ext.grid.RowNumberer", {
width:60,
renderer: function(value, appearance, record, rowIndex) {
var columnIndex = ESDataListControl.totalDocSize - (ESDataListControl.pageSize*(ESDataListControl.currPage-1)) - rowIndex;
return columnIndex;
}
});
var grid = new Ext.create("Ext.grid.Panel", {
id: "esDataViewGridId",
title: "Elasticsearch Data Management Grids",
layout: "fit",
store: ESDataListControl.dataStore,
queryMode: "local",
autoRender: "true",
autoShow: "true",
autoResize: "true",
loadMask : true,
selModel:Ext.create("Ext.selection.CheckboxModel", {
checkOnly: true,
listeners : {
deselect: function(model, record, index) {
delete ESDataVar.ids[record.raw._id];
console.log(ESDataVar.ids);
},
select: function(model, record, index) {
ESDataVar.ids[record.raw._id] = {"_index":"", "_type":"", "_id":""};
ESDataVar.ids[record.raw._id]._index = record.raw._index;
ESDataVar.ids[record.raw._id]._type = record.raw._type;
ESDataVar.ids[record.raw._id]._id = record.raw._id;
console.log(ESDataVar.ids);
}
}
}),
columns: columnArr,
renderTo : "esDataViewGridPanel",
bbar: new Ext.PagingToolbar({
pageSize: ESDataListControl.pageSize,
store: ESDataListControl.dataStore,
displayInfo: true,
displayMsg: "Displaying topics {0} - {1} of {2}",
emptyMsg: "No topics to display",
items:[
"-",
{
pressed: true,
enableToggle: true,
text: "Delete",
cls: "x-btn-text-icon details",
toggleHandler: function(btn, pressed){
ESDataListControl.deleteDocFromIds();
}
}
],
moveFirst : function () {
ESDataListControl.currPage = 1;
ESDataListControl.getPagingSearchMatchAll();
},
moveLast : function () {
ESDataListControl.currPage = ESDataListControl.endPage;
ESDataListControl.getPagingSearchMatchAll();
},
moveNext : function () {
ESDataListControl.currPage++;
ESDataListControl.getPagingSearchMatchAll();
},
movePrevious : function () {
ESDataListControl.currPage--;
ESDataListControl.getPagingSearchMatchAll();
},
listeners: {change : function(thisd, params) {
console.log("pagingToolbar listener");
}
}
})
});
그냥 객체에 대한 attribute 와 property 를 모두 디버깅해서 필요한 API 를 찾아 사용하는 것도 방법 일 수 있습니다.
다만 시간과 노력이 많이 듭니다. ^^;