1. #1
    Ext User Stripeman's Avatar
    Join Date
    Apr 2008
    Location
    Heidelberg Germany
    Posts
    275
    Vote Rating
    0
    Stripeman is on a distinguished road

      0  

    Default How do I: Property Grid: define custom column names..

    How do I: Property Grid: define custom column names..


    I had thought that one could define a custom name for each column in a property grid. Not the name/value.. but in the grid itsself.

    IE:

    select lname, fname, bday from users were ID = 1;
    results -> put in store

    property grid has headers of Name / Value
    but each row is identifed as each column from the store. in this case its lname, fname and bday. i want the lname to be displayed as "Last Name" etc.

    In my post: http://extjs.com/forum/showthread.php?t=43390 (2nd one)
    I posted one of my custom columns as:

    PHP Code:
                    var comboBoxSecCakeField    = new Ext.form.ComboBox({
                                                                                 
    name:'SecCake'  
                                                                                
    ,hiddenId:'SecCake'
                                                                                
    ,hiddenName:'SecCake'
                                                                                
    ,storeSecCakeStore
                                                                                
    ,displayField'name'
                                                                                
    ,valueField'name'
                                                                                
    ,triggerAction:'all'  
                                                                                
    ,selectOnFocus:true 
                                                                                
    ,mode:'local'
                                                                                
    ,loadingText:'Loading...'
                                                                                
    ,typeAhead:true
                                                                                
    ,allowBlank:true
                                                                                
    ,emptyText:'Select SecCake...'  
                                                                                
    ,editable:true
                                                                           
    }); 
    But none of the custom column names is taking. Am i doing something wrong ? I need the ie to remain the same because it had to update the db with it. But i need the display name to be customizable.

    Thanks for any help

  2. #2
    Ext JS Premium Member saJoshua's Avatar
    Join Date
    Nov 2007
    Location
    South Africa
    Posts
    521
    Vote Rating
    5
    saJoshua is on a distinguished road

      0  

    Default


    Unfortunately the propertyGrid's column model does not allow for renaming of the columns. See this thread: http://extjs.com/forum/showthread.ph...718#post195718

    Another thread on the same nature. Not sure if it bears any fruit : http://extjs.com/forum/showthread.php?t=17489

    Joshua

  3. #3
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    92
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    You can rename the columns of a propertygrid by setting:

    Code:
    Ext.grid.PropertyColumnModel.prototype.nameText = 'Name';
    Ext.grid.PropertyColumnModel.prototype.valueText = 'Value';
    But if I understand correctly you don't want to change the column names, you want to change the property names.

    For that you can use the (undocumented) propertyNames config option, e.g.

    Code:
    var grid = new Ext.grid.PropertyGrid({
      ...
      propertyNames: {
        'lname': 'Last Name',
        'fname': 'First Name',
        'bday': 'Birthday'
      }
    });

  4. #4
    Ext User Stripeman's Avatar
    Join Date
    Apr 2008
    Location
    Heidelberg Germany
    Posts
    275
    Vote Rating
    0
    Stripeman is on a distinguished road

      0  

    Default


    Quote Originally Posted by Condor View Post
    You can rename the columns of a propertygrid by setting:

    Code:
    Ext.grid.PropertyColumnModel.prototype.nameText = 'Name';
    Ext.grid.PropertyColumnModel.prototype.valueText = 'Value';
    But if I understand correctly you don't want to change the column names, you want to change the property names.

    For that you can use the (undocumented) propertyNames config option, e.g.

    Code:
    var grid = new Ext.grid.PropertyGrid({
      ...
      propertyNames: {
        'lname': 'Last Name',
        'fname': 'First Name',
        'bday': 'Birthday'
      }
    });


    There is no way to put this in each form element?
    IE: new Ext.form.TextField({ allowBlank:false, propertyNames: 'Alternate Field Name' });

    yes you are right Condor.. I NEED the value and name to rename as it should be.. but just want a different name displayed.

    having lname or fname listed on the property grid is NOT user friendly as Seeing "First name" and "Last Name"!

    Terry

  5. #5
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    92
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    The property name/display name mapping (propertyNames) is completely separate from the property name/editor mapping (customEditors).

    So you can't specify the display name in the editor, but why would you need to?

  6. #6
    Ext User Stripeman's Avatar
    Join Date
    Apr 2008
    Location
    Heidelberg Germany
    Posts
    275
    Vote Rating
    0
    Stripeman is on a distinguished road

      0  

    Default


    Only to keep all the config in one place. I mean the way its setup right now i have an array for the new record, columnmodel, custom editors and now iwll have to have one for the names...

  7. #7
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    92
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    Maybe it's easier to use an EditorGridPanel instead.
    You could fill your records with the property name, the display name, the value and the editor (all nicely together).
    And in the columnmodel you could override getCellEditor to return the editor from the record instead of the one from the column model.

    You could look at this post for an example (doesn't do exactly what you want, but you could modify it).

  8. #8
    Ext User Stripeman's Avatar
    Join Date
    Apr 2008
    Location
    Heidelberg Germany
    Posts
    275
    Vote Rating
    0
    Stripeman is on a distinguished road

      0  

    Default


    Thats a great post and super example.. but sorta seems like a hack to do what a property grid should be able to do effortlessly. I will considering redoing my grid. I only want the displayName and the value shown - a 'valueName' should be the actual db (or store) column name.

    The nice thing about what you suggested earlier is that i only have to do it for columns that need a custom name.

    Thanks so much for your time and post Condor.

  9. #9
    Ext User
    Join Date
    Jul 2007
    Posts
    3,128
    Vote Rating
    1
    devnull is an unknown quantity at this point

      0  

    Default


    This is one of the issues I tried to address with my improved property grid extension, which may interest you: http://extjs.com/forum/showthread.php?t=41390

  10. #10
    Sencha User
    Join Date
    Sep 2012
    Posts
    1
    Vote Rating
    2
    aramk is on a distinguished road

      2  

    Default


    For Ext JS 4:

    Code:
    listeners : {
            beforerender : function() {
                var cols = this.getView().getHeaderCt().getGridColumns();
                cols[0].setText("Property");
            }
        }