1. #1
    Ext User
    Join Date
    Jan 2008
    Location
    Jena, Germany
    Posts
    28
    Vote Rating
    0
    S1-Gezi is on a distinguished road

      0  

    Default [2.0.2] EditorGrid: Input value not save into Record

    [2.0.2] EditorGrid: Input value not save into Record


    Hi all!

    My environment: ExtJS 2.0.2, Firefox 2.0.0.13, IE 7.0.6001.18000

    I have an EditorGrid + ColumnModel + RowSelectionModel. Four columns, each column with custom editor and renderer. First, 2th and 4th column is a combobox, 3th is a TriggerField.
    My EditorGrid is implemented as Popup with "Save" and "Cancel" button.
    Steps to repeat:
    1.) add new row to the grid
    2.) select a value in combobox of 1th,2th,4th column
    3.) click into field of 3th column & type in something valid
    4.) let the cursor stay in the field of 3th column and press "Save" button

    Problem:
    Firefox sometime simply ignore my input and to not store my value at the corresponding Record-instance. Sometimes Firefox throw an error:
    F has no properties <ext-base.js line 10>

    IE simply ignore my input and to not store my value at the corresponding Record-instance.

    It seems that EditorGrid#onEditComplete is sometimes called, sometimes not. Or it dows not work properly.

    Is this a known bug?

    Thanks
    Frank

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    17,170
    Vote Rating
    674
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    Since this is quite a specific test case, an example demonstrating it would be great.

  3. #3
    Ext User
    Join Date
    Jan 2008
    Location
    Jena, Germany
    Posts
    28
    Vote Rating
    0
    S1-Gezi is on a distinguished road

      0  

    Default


    As suggested by mjlecomte I put all the stuff into one html file
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title> [2.0.2] EditorGrid: Input value not save into Record</title>
    <link rel="stylesheet" type="text/css" href="../ext/resources/css/ext-all.css"/>
    <script type="text/javascript" src="../ext/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="../ext/ext-all-debug.js"></script>

    <script type="text/javascript">
    Ext.onReady(function(){
    Ext.BLANK_IMAGE_URL = '../ext/resources/images/default/s.gif';
    Ext.QuickTips.init();
    });
    </script>
    </head>
    <body>
    <script type="text/javascript">
    Ext.namespace('MyNamespace');

    MyNamespace.ProductFilterSet = Ext.extend(Ext.grid.EditorGridPanel, {
    initComponent : function() {

    var qualifierCombo = new Ext.form.ComboBox({
    store: Ext.StoreMgr.get('qualifierStore'),
    valueField: 'qualVal',
    displayField: 'displ',
    mode: 'local',
    editable:false
    });

    var operatorCombo = new Ext.form.ComboBox({
    store: Ext.StoreMgr.get('operatorStore'),
    valueField: 'opVal',
    displayField: 'displ',
    mode: 'local',
    editable:false
    });

    var valueEditor = new Ext.form.TriggerField({
    allowBlank: false
    });

    var cm = new Ext.grid.ColumnModel(
    [{
    id:'filterid',
    dataIndex: 'filterid',
    hidden:true
    },{
    id:'qualifier',
    header: "Qualifier",
    dataIndex: 'qualifier',
    width: 100,
    editor: qualifierCombo
    },{
    id:'operator',
    header: "Operator",
    dataIndex: 'operator',
    width: 130,
    editor: operatorCombo
    },{
    id:'value',
    header: "Value",
    dataIndex: 'value',
    editor: valueEditor
    }]);

    var FilterSetRecord = Ext.data.Record.create([{name: 'filterid'},{name: 'qualifier'},{name: 'operator'},{name: 'value'}])
    var store = new Ext.data.JsonStore({
    storeId: 'fooStore',
    reader:new Ext.data.JsonReader({id:'filterid'},FilterSetRecord),
    fields:['filterid','qualifier','operator','value']
    });

    Ext.apply(this,{
    autoExpandColumn:'value',
    autoHeight:true,
    clicksToEdit:1,
    storetore,
    cm: cm,
    sm: new Ext.grid.RowSelectionModel(),
    tbar: [{
    panel:this,
    text: 'Add Qualifier',
    handler : function(){
    this.panel.addProductFilter();
    }
    }]
    });
    MyNamespace.ProductFilterSet.superclass.initComponent.call(this);
    },
    addProductFilter : function(config){
    var store = this.getStore();
    var ProductFilter = store.recordType;

    //generate a unique id for the new filter
    var dt = new Date();

    store.add(new ProductFilter({
    filterid:dt.format('Fj,Y,g:ia'),
    qualifier: '',
    operator: '',
    value:''
    }));
    }
    });

    MyNamespace.ProductFilterDialog2 = Ext.extend(Ext.Window, {
    initComponent : function() {

    new Ext.data.JsonStore({
    data: MyNamespace.Qualifiers,
    root: 'root',
    storeId: 'qualifierStore',
    id: 'qualVal',
    fields: [{name:'qualVal', type:'string'}, {name:'displ', type:'string'}]
    });

    new Ext.data.JsonStore({
    data: MyNamespace.Operators,
    root: 'root',
    storeId: 'operatorStore',
    id: 'opVal',
    fields: [{name:'opVal', type:'string'}, {name:'displ', type:'string'}]
    });

    var filterSet = new MyNamespace.ProductFilterSet();
    Ext.apply(this, {
    closeAction:'hide',
    items:[filterSet],
    buttons: [{
    text:'Save',
    panel:this,
    handler: this.saveSelection
    }]
    });
    MyNamespace.ProductFilterDialog2.superclass.initComponent.call(this);
    },
    saveSelection : function() {
    var store = Ext.StoreMgr.get('fooStore');

    store.each(
    function(r){

    Ext.log("qualifier="+r.get('qualifier')+" operator="+r.get('operator')+" value="+r.get('value'));
    }, this);
    this.panel.hide();
    }
    });

    MyNamespace.Qualifiers = {
    "root": [
    {"qualVal":"Brand","displ":"Brand"},
    {"qualVal":"Price","displ":"Price"}
    ]};

    MyNamespace.Operators = {
    "root": [
    {
    "opVal": "equals",
    "displ": "equals"
    },{
    "opVal": "less than",
    "displ": "less than"
    }]};
    function onButton()
    {
    var dialog = new MyNamespace.ProductFilterDialog2({
    width:1100,
    height:300,
    renderTo:document.body,
    autoScroll :true
    });
    dialog.show();
    }
    </script>
    <div id="foo">
    <table border="0" cellpadding="0" cellspacing="0" width="100%">
    <tr><td><input type="submit" name="foo" value="Click me" class="button" onClick="onButton()"/></td></tr>
    </table>
    </div>
    </body>
    </html>

    I debugged it in IE with Companion-Debugger.

    Thanks Frank

  4. #4
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996
    Vote Rating
    6
    mjlecomte will become famous soon enough mjlecomte will become famous soon enough

      0  

    Default


    Typically people will get confirmation of a bug in the help forums before posting a bug in the bug forum.

    Also, it is recommended to strip down problems to the smallest possible test case that reproduces the problem. Also, make the code self contained (a single html file for example) that only references ext-all-debug.js, etc. that has self contained sample data for the example to work as a single cut/paste so someone else can test on their local machine.

    See this for an example: http://extjs.com/forum/showthread.ph...387#post142387

Thread Participants: 2