View Full Version : Locked grid columns prevent non-locked columns being editable.

31 May 2011, 7:12 AM
A grid has three columns, all editable, and the first column is locked. The data store contains four rows of data.

Clicking into a cell in the locked column correctly puts that cell into edit mode.

Clicking into a cell in an unlocked column generates the JavaScript errors "grid.getView().el is undefined" followed by "owner.boundEl is null".

All cells in unlocked columns become uneditable. Only cells in locked columns can be edited.

Tested on IE6-IE9, Firefox 3.6, Opera 11, Chrome 9 and Safari 5.

The code below is stand alone HTML that demonstrates the symptoms.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<link rel="stylesheet" type="text/css" href="http://dev.sencha.com/deploy/ext-4.0.1/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="http://dev.sencha.com/deploy/ext-4.0.1/examples/shared/example.css" />
<script type="text/javascript" src="http://dev.sencha.com/deploy/ext-4.0.1/ext-all-debug.js"></script>


<script type="text/javascript">


Ext.onReady(function() {

Ext.create('Ext.data.Store', {
fields:['name', 'email', 'phone'],
{"name":"Lisa", "email":"[email protected]", "phone":"555-111-1224"},
{"name":"Bart", "email":"[email protected]", "phone":"555--222-1234"},
{"name":"Homer", "email":"[email protected]", "phone":"555-222-1244"},
{"name":"Marge", "email":"[email protected]", "phone":"555-222-1254"}
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'items'

var rowEditing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1

Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
selModel: { selType: 'rowmodel' },
plugins: [rowEditing],
columns: [
header: 'Name',
dataIndex: 'name',
width: 200,
locked: true,
field: { xtype: 'textfield' }
header: 'Email',
width: 200,
field: { xtype: 'textfield' },
dataIndex: 'email'
header: 'Phone',
width: 200,
field: { xtype: 'textfield' },
dataIndex: 'phone'
height: 200,
width: 500,
renderTo: Ext.getBody()




31 May 2011, 7:34 AM
This is the same as http://www.sencha.com/forum/showthread.php?132727-OPEN-EXTJSIV-1868-Cannot-edit-cells-in-a-locked-grid&highlight=EXTJSIV-1868