PDA

View Full Version : [DEFER] ExtJS 3.3.0 GridPanel - bunch of problems



vladsch
21 Jun 2010, 5:37 AM
Hi,

Version - ExtJS 3.3.0 (rev 6768)
Browser - FF

The problems occurs if there is the following DOCTYPE in the page

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

1. 'autoExpandColumn' doesn't work under FF (auto expand column is too much wide)
2. column resizing doesn't correctly under FF (all columns are resizing after one column resize). Header resizing and data columns are not synhronized
3. If you edit a record field and column renderer uses meta argument (second argument of the renderer) then meta is undefined

Here is my test case


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>
Simple Array Grid
</title>

<link rel="stylesheet" type="text/css" href="/extjs/resources/css/ext-all-embedded-css/ext.axd?v=27736" />
<script type="text/javascript" src="/extjs/adapter/ext/ext-base-js/ext.axd?v=27736"></script>
<script type="text/javascript" src="/extjs/ext-all-js/ext.axd?v=27736"></script>

<script type="text/javascript">
Ext.onReady(function () {
var grid = new Ext.grid.GridPanel({
store: new Ext.data.Store({
autoLoad: true,
reader: new Ext.data.ArrayReader({
fields: [{
name: "company"
}, {
name: "price",
type: "float"
}, {
name: "change",
type: "float"
}, {
name: "pctChange",
type: "float"
}, {
name: "lastChange",
type: "date",
dateFormat: "n/j h:ia"
}]
}),
proxy: new Ext.data.MemoryProxy([
["3m Co", 71.72, 0.02, 0.03, "9/1 12:00am"],
["Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am"],
["Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am"]
])
}),
id: "GridPanel1",
renderTo: "GridPanel1_Container",
height: 350,
width: 600,
title: "Array Grid",
autoExpandColumn: "Company",
stripeRows: true,
trackMouseOver: true,
selectionMemory: false,
cm: new Ext.grid.ColumnModel({
defaultSortable: true,
columns: [{
dataIndex: "company",
header: "Company",
id: "Company",
renderer : function(value, meta, record){
// after the button click you will see the error that meta is undefined
meta.css = "x-my-css-rule";
return value;
}
}, {
dataIndex: "price",
header: "Price",
renderer: Ext.util.Format.usMoney
}, {
dataIndex: "change",
header: "Change",
id: "Change"
}, {
dataIndex: "pctChange",
header: "Change"
}, {
dataIndex: "lastChange",
header: "Last Updated",
xtype: "datecolumn",
format: "d.m.Y"
}]
}),

buttons : [
new Ext.Button({
text: "Click to see the error",
handler: function(){
grid.store.getAt(0).set("Company", "New company")
}
})
]
});
});
</script>
</head>
<body>
<div id="GridPanel1_Container">
</div>
</body>
</html>

vladsch
21 Jun 2010, 9:44 AM
Hi,

Another problem

Browser -Chrome 5.0

Page with the following DOCTYPE (like in the first post)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

and


<html xmlns="http://www.w3.org/1999/xhtml">

Problem description:
- checkbox selection model column incorrect rendering
- row expander column incorrect rendering

http://content.screencast.com/users/vladsch/folders/Jing/media/595ea8a9-9bc9-4b00-bbb2-5e3f479ef55d/2010-06-21_2142.png

Jamie Avins
21 Jun 2010, 10:29 AM
Thanks for the report, it's under active development. We'll take a look as it gets closer to being complete.

edspencer
21 Jun 2010, 10:33 AM
Thanks for checking this out. The 3.3 branch is currently undergoing a large number of changes to the GridView so expect things to be broken for the next few days. I'll check out your and our examples as soon as I've finished my refactoring.