Cell Editing on ExtJS

0
votes

I am trying to make my grid.Panel cells editable with one click. I have following code that doesn't work. I followed this this link and implemented in my program but still clicking doesn't enable editing. I also tried RowEditing but it didn't work either. There is no problem getting info from database.

Ext.define('CategoryNumberGrid', {
  extend: 'Ext.grid.Panel',
  selType: 'cellmodel',
  pageSize: 25,
  defineColumns:function(){
    this.columns=[
    {
      header: 'Code',
      dataIndex: 'code',
      renderer: Ext.util.Format.htmlEncode
    },{
      header: 'Description',
      dataIndex: 'descr',
      renderer: Ext.util.Format.htmlEncode
    }];
  },
  model: 'CategoryNumberModel',
  initComponent:function(){
    this.defineColumns();
    var config = {
      autoLoad: true,
      autoSync: true,
      remoteFilter: true,
      remoteSort: true,
      proxy: getProxy("CategoryNumberModel"),
      model: 'CategoryNumberModel',
      sorters:[
      {
        property:'code',
        direction:'ASC'
      }],
      pageSize: this.pageSize
    };
    this.Store = Ext.create('Ext.data.Store', config);
    this.editing = Ext.create('Ext.grid.plugin.CellEditing', {
      clicksToEdit:1});
    this.plugins=[this.editing];
    this.callParent();
  }
});
1
javascriptextjs
What is this.editing in you case. grid don't have any editing config. - UDID
I have put your code into a fiddle but I get an error: Uncaught ReferenceError: getProxy is not defined. - Alexander
Have you tried to add editors to the columns? Config column.editor - Alexander

1 Answers

2
votes
  • Your sample is not complete (not runnable) as per the question guidelines.
  • JavaScript is case-sensitive. this.Store won't help a grid to find its data.
  • Your columns are lacking the editor config.

I have corrected the issues: https://fiddle.sencha.com/#fiddle/1f41

For future questions, please consider making a working fiddle that exhibits the problem.