PDA

View Full Version : [OPEN-EXTJSIV-1397][4.0.0] Grid with locked column AND cellEditing - javascript error



eja40
16 Apr 2011, 2:52 AM
If you enable cellEditing on a grid with a locked column the grid doesn't work and the javascript error is:
grid.view is undefined - line 35237

If you comment out the indicated line (cellEditing) it loads in Firefox.

HOWEVER this grid doesn't load at all in IE8 even when it loads in Firefox.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="/core/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="/core/ext/ext-all-debug-w-comments.js"></script>
<script type="text/javascript">
Ext.onReady(function() {

Ext.regModel('Data',{
fields: [
{name: 'PersonID', type: 'int'},
{name: 'PersonName', type: 'string'},
{name: 'S461M1', type: 'string'},{name: 'S461M2', type: 'string'},{name: 'S462M1', type: 'string'},{name: 'S462M2', type: 'string'},{name: 'S463M1', type: 'string'},{name: 'S463M2', type: 'string'},{name: 'S464M1', type: 'string'},{name: 'S464M2', type: 'string'},{name: 'S465M1', type: 'string'},{name: 'S465M2', type: 'string'},{name: 'S466M1', type: 'string'},{name: 'S466M2', type: 'string'},{name: 'S467M1', type: 'string'},{name: 'S467M2', type: 'string'},{name: 'S468M1', type: 'string'},{name: 'S468M2', type: 'string'},{name: 'S469M1', type: 'string'},{name: 'S469M2', type: 'string'},{name: 'S470M1', type: 'string'},{name: 'S470M2', type: 'string'},{name: 'S471M1', type: 'string'},{name: 'S471M2', type: 'string'},
],
idProperty: 'PersonID',
});


// create the Data Store
var testStore = new Ext.data.Store({
autoDestroy: true,
autoLoad: true,
model: 'Data',
"data":[{"PersonID":76,"PersonName":"Karen Connolly","S461M1":"\/","S461M2":"","S462M1":"O","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":15,"PersonName":"Alexa Edwards","S461M1":"L","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"L","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":13,"PersonName":"Emilia Fox","S461M1":"\/","S461M2":"","S462M1":"O","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"L","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":40,"PersonName":"Rigoberto Green","S461M1":"\/","S461M2":"","S462M1":"L","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"L","S464M2":"","S465M1":"L","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"O","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":36,"PersonName":"Hailey Griffiths","S461M1":"\/","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"O","S471M2":""},{"PersonID":123,"PersonName":"Tylor Harvey","S461M1":"\/","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"L","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"O","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"L","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":39,"PersonName":"Kate James","S461M1":"\/","S461M2":"","S462M1":"L","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"O","S466M2":"","S467M1":"O","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"O","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":78,"PersonName":"Keyon Jenkins","S461M1":"\/","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"L","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":99,"PersonName":"Quinn King","S461M1":"\/","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"O","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":79,"PersonName":"Addison Lewis","S461M1":"\/","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"L","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"O","S471M2":""},{"PersonID":125,"PersonName":"Tierra Mitchell","S461M1":"\/","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"L","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"O","S471M2":""},{"PersonID":59,"PersonName":"Candice O'Brien","S461M1":"\/","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"L","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":104,"PersonName":"Zachariah Ross","S461M1":"\/","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"L","S467M2":"","S468M1":"L","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":56,"PersonName":"Nikki Smith","S461M1":"L","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"O","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"L","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":17,"PersonName":"Bridget\tFernanda Thomas","S461M1":"\/","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":98,"PersonName":"Donna Warren","S461M1":"\/","S461M2":"","S462M1":"\/","S462M2":"","S463M1":"\/","S463M2":"","S464M1":"O","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"O","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"L","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":33,"PersonName":"Cole Young","S461M1":"\/","S461M2":"","S462M1":"L","S462M2":"","S463M1":"L","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"O","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"\/","S471M2":""},{"PersonID":34,"PersonName":"Kiera Young","S461M1":"L","S461M2":"","S462M1":"L","S462M2":"","S463M1":"L","S463M2":"","S464M1":"\/","S464M2":"","S465M1":"\/","S465M2":"","S466M1":"\/","S466M2":"","S467M1":"\/","S467M2":"","S468M1":"\/","S468M2":"","S469M1":"\/","S469M2":"","S470M1":"\/","S470M2":"","S471M1":"L","S471M2":""}]
});

var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
});


// create the grid
var testGrid = new Ext.grid.GridPanel({
id: 'testGrid',
store: testStore,
renderTo: 'grid-example',
columnLines: true,
height: 300,
width: 300,
columns: [
{text: "Person", width: 100, dataIndex: 'PersonName', sortable: true, locked: true },
{text: '1', width: 25, dataIndex: 'S461M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
{text: '1', width: 25, dataIndex: 'S462M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
{text: '1', width: 25, dataIndex: 'S463M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
{text: '1', width: 25, dataIndex: 'S464M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
{text: '1', width: 25, dataIndex: 'S465M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
{text: '1', width: 25, dataIndex: 'S466M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
{text: '1', width: 25, dataIndex: 'S467M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
{text: '1', width: 25, dataIndex: 'S468M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
{text: '1', width: 25, dataIndex: 'S469M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
{text: '1', width: 25, dataIndex: 'S470M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
{text: '1', width: 25, dataIndex: 'S471M1', sortable: true, align: 'center' , field: { allowBlank: false }, },
],
autoScroll: true,
margin: 3,
selModel: {
selType: 'cellmodel'
},
// Comment this out to get it to work in Firefox:
plugins: [cellEditing], /********* COMMENT ME OUT *************/

});

});
</script></head>
<body>
<div id="grid-example"></div>
</body></html>

arthurakay
19 Apr 2011, 1:44 PM
I also just ran into this bug. I'll see if I can poke the dev team so that they can log an official bug in the ticketing system.



Ext.getBody().update('');

Ext.require([
'Ext.selection.CellModel',
'Ext.grid.*',
'Ext.data.*',
'Ext.util.*',
'Ext.state.*',
'Ext.form.*'
]);

Ext.onReady(function(){

function formatDate(value){
return value ? Ext.Date.dateFormat(value, 'M d, Y') : '';
}

Ext.define('Plant', {
extend: 'Ext.data.Model',
fields: [
// the 'name' below matches the tag name to read, except 'availDate'
// which is mapped to the tag 'availability'
{name: 'common', type: 'string'},
{name: 'botanical', type: 'string'},
{name: 'light'},
{name: 'price', type: 'float'},
// dates can be automatically converted by specifying dateFormat
{name: 'availDate', mapping: 'availability', type: 'date', dateFormat: 'm/d/Y'},
{name: 'indoor', type: 'bool'}
]
});


// create the Data Store
var store = Ext.create('Ext.data.Store', {
// destroy the store if the grid is destroyed
autoDestroy: true,
model: 'Plant',
data: []
});

var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
});

// create the grid and specify what field you want
// to use for the editor at each header.
var grid = Ext.create('Ext.grid.Panel', {
store: store,
columns: [{
id: 'common',
header: 'Common Name',
dataIndex: 'common',
locked: true,
}, {
header: 'Price',
dataIndex: 'price',
width: 70,
align: 'right',
renderer: 'usMoney',
field: {
xtype: 'numberfield',
allowBlank: false,
minValue: 0,
maxValue: 100000
}
}, {
header: 'Available',
dataIndex: 'availDate',
width: 95,
renderer: formatDate,
field: {
xtype: 'datefield',
format: 'm/d/y',
minValue: '01/01/06',
disabledDays: [0, 6],
disabledDaysText: 'Plants are not available on the weekends'
}
}],
selModel: { selType: 'cellmodel' },
renderTo: Ext.getBody(),
width: 600,
height: 300,
title: 'Edit Plants?',
frame: true,
plugins: [cellEditing]
});

});

arthurakay
26 Apr 2011, 10:41 AM
I don't think this issue was fixed in 4.0.0

The "grid.view is undefined" error is gone, but now I see "this.horizontalScroller is undefined" line 79126 ext-all-debug.js

arthurakay
27 Apr 2011, 9:34 AM
On further inspection, the problem I'm seeing in 4.0.0 is the result of reconfiguring the grid - not the locked columns.

The example below works:

Ext.getBody().update('');
Ext.define('Test', {
extend: 'Ext.data.Model',
fields: [ {name: 'name', type: 'string'} ]
});
var store = new Ext.data.Store({
model: 'Test',
data: [
{ name: '123' }
]
});
var columns = [{
header: 'Name',
dataIndex: 'name',
locked: true,
field: { allowBlank: false }
}];
var grid = new Ext.grid.Panel({
renderTo: document.body,
store: store,
height: 300,
width: 300,
columns: columns,
plugins: [
Ext.create('Ext.grid.plugin.CellEditing', { clicksToEdit: 1 })
]
});
//grid.reconfigure(store, columns);

Uncommenting the reconfigure line breaks things. I have reported that bug separately.