1. #1
    Sencha User
    Join Date
    Mar 2010
    Posts
    10
    Answers
    1
    Vote Rating
    1
    r_sarvas is on a distinguished road

      0  

    Default Answered: Property grid questions

    Answered: Property grid questions


    Is there any way to set the property grid field names and widths in ExtJS 4.x? I feel like I'm missing something obvious in the documentation.

  2. Well, this works, but it's a bit of a workaround:

    Code:
    var p = Ext.create('Ext.grid.property.Grid', {
        title: 'Properties Grid',
        width: 300,
        renderTo: Ext.getBody(),
        source: {
            "(name)": "My Object",
            "Created": Ext.Date.parse('10/15/2006', 'm/d/Y'),
            "Available": false,
            "Version": 0.01,
            "Description": "A test object"
        }
    });
    p.columns[0].setText('NameHeader');
    p.columns[1].setText('PropertyHeader');
    And as to your question about the grey area...I'm not sure. I think it's a carry over from visual ides like Visual Studio and their property grid when creating ui's....I would imagine you can somehow change their color using css classes.

  3. #2
    Sencha User
    Join Date
    Mar 2012
    Location
    Oklahoma, USA
    Posts
    52
    Answers
    10
    Vote Rating
    8
    sdt6585 will become famous soon enough

      0  

    Default


    I think it's the configs nameColumnWidth and columnWidth for column widths.

    Then I think you use nameField and valueField set as keys from the object that you set as the source. Then in your source object, you have those keys set to whatever you want the column names to be...not positive on that one though.

  4. #3
    Sencha User
    Join Date
    Mar 2010
    Posts
    10
    Answers
    1
    Vote Rating
    1
    r_sarvas is on a distinguished road

      0  

    Default


    Quote Originally Posted by sdt6585 View Post
    I think it's the configs nameColumnWidth and columnWidth for column widths.

    Then I think you use nameField and valueField set as keys from the object that you set as the source. Then in your source object, you have those keys set to whatever you want the column names to be...not positive on that one though.
    I actually noticed the nameColumnWidth property shortly after making this post (not sure how I missed that the first time), though I'm still at a loss as to how to do the column name change. The nameField property seems to be used for selecting what field in the data store populates the the content of the name column. Based on further testing I'm getting the feeling that the property I'm looking for might be somehow accessed through propertyNames, though I haven't been able to confirm this or find an example that works with ExtJS 4 - most example on the web are from ExtJS 2.x and don't work quite the same.

    Also, what's the deal with the grey area to the left of each of the values in the property name column? Can that be turned off?

  5. #4
    Sencha User
    Join Date
    Mar 2012
    Location
    Oklahoma, USA
    Posts
    52
    Answers
    10
    Vote Rating
    8
    sdt6585 will become famous soon enough

      0  

    Default


    Well, this works, but it's a bit of a workaround:

    Code:
    var p = Ext.create('Ext.grid.property.Grid', {
        title: 'Properties Grid',
        width: 300,
        renderTo: Ext.getBody(),
        source: {
            "(name)": "My Object",
            "Created": Ext.Date.parse('10/15/2006', 'm/d/Y'),
            "Available": false,
            "Version": 0.01,
            "Description": "A test object"
        }
    });
    p.columns[0].setText('NameHeader');
    p.columns[1].setText('PropertyHeader');
    And as to your question about the grey area...I'm not sure. I think it's a carry over from visual ides like Visual Studio and their property grid when creating ui's....I would imagine you can somehow change their color using css classes.

  6. #5
    Sencha User
    Join Date
    Mar 2010
    Posts
    10
    Answers
    1
    Vote Rating
    1
    r_sarvas is on a distinguished road

      1  

    Default


    Thanks, that did the trick. It looks as though sorting also needs to be set in a similar fashion. I'm finding that part of my problem is that I'm using 4.0.7 and that a number of things associated with the store don't quite work as they should. See other forum post here:

    http://www.sencha.com/forum/showthre...=property+grid

    At any rate, in case anyone else should happen to be looking for a similar solution, here's an update to your code that also includes the fix for sorting and setting the name column field length as you pointed out earlier.

    Code:
    var p = Ext.create('Ext.grid.property.Grid', {
         title: 'Properties Grid',
         width: 300,
         nameColumnWidth: 100,
         renderTo: Ext.getBody(),
         source: {
             "(name)": "My Object",
             "Created": Ext.Date.parse('10/15/2006', 'm/d/Y'),
             "Available": false,
             "Version": 0.01,
             "Description": "A test object"
         } }); 
    
    p.columns[0].setText('NameHeader');
    p.columns[1].setText('PropertyHeader');
    p.store.sort('none');
    p.columns[0].tdCls=''; //removes the grey area next to the property name
    As for the gray area in the property name column, that looks like it is being applied as a background image ("[ExtJS location]/resources/themes/images/default/grid/property-cell-bg.gif") as the result of a style called "x-grid-property-name". After a bit if searching through the ExtJS code I found how to turn it off using what looks like an internal setting called "tdCls". The code above has been updated to include this setting as well. Setting "tdCls" to null removes the grey background and it to "x-grid-property-name" turns it back on. It also looks as though you could use this same property to apply other CSS class values to both the property and value columns.
    Last edited by r_sarvas; 19 Jul 2012 at 10:52 AM. Reason: Found out some info about the grey area and how to disable it

Thread Participants: 1

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi