PDA

View Full Version : [4.2.3] Grid not emitting boxready event



guilhem.brouat
15 Jul 2015, 11:57 PM
Ext version tested:
4.2.3.1168

Browser versions tested against:
Chrome 43, IE 11

Description:
I detected a bug while migrating some code from ExtJS 4.2.1 to 4.2.3. I was displaying a grid using the BufferedRenderer plugin, and when I scrolled beyond the trailingBufferZone, all rows in the grid disappeared. After some digging in the plugin's code, I determined that the grid never emitted the boxready event; which, for this plugin in particular, meant it never computed the view's height.

Apparently, some other events are not emitted, like columnresize, which caused a custom plugin of mine to stop working properly. I don't know if other events are missing...

Steps to reproduce the problem:

Here is a sample, minimal code, showing the problem. If I use 4.2.1, both console.log statements are executed; but ,not with 4.2.3.



<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="http://localhost/ext/extjs-4.2.3/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://localhost/ext/extjs-4.2.3/ext-all-debug.js"></script>
</head>


<body>
<script type="text/javascript">
Ext.create('Ext.grid.Panel', {
renderTo : Ext.getBody(),
height : 700,
columns : [
{
text : 'ID',
dataIndex : 'id',
flex : 1
},
{
text : 'Name',
dataIndex : 'name',
flex : 4
}
],
store : {
fields : ['id', 'name'],
data : [{"id":0,"name":"7751b98cbc7318a79b66"},{"id":1,"name":"43fe22a8ebe7615fef21"},{"id":2,"name":"77512b3aff7fa4e4a812"},{"id":3,"name":"93d3d3a6297ac3c582c9"},{"id":4,"name":"907a095c2813956cb7e9"},{"id":5,"name":"ff58de257f6eea3e1b2f"},{"id":6,"name":"7a88f3ac084a5769e3dd"},{"id":7,"name":"8fba57d365a084cd375d"},{"id":8,"name":"5b5fad67c2b98e9dfe01"},{"id":9,"name":"2a20b0ad81c3ead3d8ce"},{"id":10,"name":"bc324cc397d701b81188"}],
proxy : { type : 'memory' }
},
listeners : {
boxready : function() { console.log('box is ready') },
columnresize : function() { console.log('column resized') }
}
});
</script>
</body>
</html>