PDA

View Full Version : Change grid emptyText dynamically



mmvpp
26 Aug 2014, 1:07 PM
Hi,

I tried to change the emptyText property dynamically but it just does not work. When the grid refreshes, it still uses the original text. Any help much appreciated.

Here is the code.

<!DOCTYPE html>
<html>
<head>
<title>Grid performance with many columns and editing</title>

<link href="https://extjs.cachefly.net/ext-4.1.1-gpl/resources/css/ext-all.css" rel="stylesheet" />
<script src="https://extjs.cachefly.net/ext-4.1.1-gpl/ext-all.js"></script>

<script>
var loadData = true;
Ext.onReady(function () {
var data = [],
columns = [],
fields = [],
i,
j;

for (j = 0; j < 50; j++) {
columns[j] = {
text: "Test" + j,
dataIndex: "test" + j,
sortable: false

}
fields[j] = {
name: "test" + j
}
}

Ext.create("Ext.grid.Panel", {
id: 'gridId',
renderTo: 'grid-report',
store: {
fields: fields,
data: data,
listeners: {
load: function(store, operation, options){
if(loadData){
for (i = 0; i < 50; i++) {
data[i] = {};
for (j = 0; j < 50; j++) {
data[i]["test" + j] = "test" + i + "" + j;
}
}
loadData = false;
}
else{
data.length = 0;
loadData = true;
}
if(Ext.getCmp('gridId') != null){
alert(Ext.getCmp('gridId').viewConfig.emptyText);
Ext.getCmp('gridId').getView().refresh();
}
}
}
},
viewConfig: {
stripeRows: true,
loadMask: true,
loadingText: 'Loading',
emptyText: 'empty',
deferEmptyText: false,
},
columns: columns,
enableColumnHide:false,
enableLocking:false,
enableColumnMove:false,
scroll: true,
width: '100%',
listeners: {
afterrender: function() {
var menu = this.headerCt.getMenu();
menu.add([{
text: 'Custom Item',
handler: function() {
var columnDataIndex = menu.activeHeader.dataIndex;
alert('custom item for column "'+columnDataIndex+'" was pressed');
}
}]);
this.viewConfig.emptyText = 'changed';
this.getView().refresh();

}
}
});
});
</script>

</head>
<body>
<div id="grid-report" style="width: 500px"></div>

<input type="button" name="refresh" value="refresh" onClick="javascript:Ext.getCmp('gridId').getStore().loadPage(1);">
</body>
</html>

mitchellsimoens
4 Sep 2014, 7:49 AM
It's working for me:

9su

mmvpp
16 Sep 2014, 9:25 AM
Thank you.
Looks like my problem was with this call...

Ext.getCmp('gridId').getView() returns a new reference on every call. It should be assigned to a variable to use the same reference.

i.e.
var gridview = Ext.getCmp('gridId').getView();
gridview.emptyText = 'changed';
gridview.refresh();

it@showmgr.com
30 Mar 2016, 10:50 AM
var view = grid.lockedGrid.getView();
view.emptyText = "New Text";
view.refresh();