disable sorting on property grid

January 05th, 2009 edit

  • Hi all!

    I'm searching for a way to disable sorting on property grid. I tried to put some "sortable" and "defaultSortable" to false at some places, but nothing happens.

    like:

    var xml = new Ext.grid.PropertyGrid({
    title: 'Properties Grid',
    store: new Ext.grid.PropertyStore({
    sortable: false,
    defaultSortable: false
    }),
    autoHeight: true,
    width: 300,
    source: {},
    renderTo: 'xmlfile'
    });
    xml.setSource(datas); // datas comes from above


    Grid is showing well, but we can sort by name column, which is not what I would like.

    I searched for a listener "beforeSort" or something, but didn't find anything in doc.

    Should I modify the core of PropertyGrid/PropertyStore, or is there a more sexy way?

    thanks,
    rekam


  • Here is a working sample of loading data for a Property Grid asynchronously in ext 2.2 . It's a bit different from a grid, since there's only a source{} property to fill if you want entries in your grid.

    It seems it's very different from the grids.

    var store = new Ext.data.JsonStore({
    url: 'json.php',
    root: 'xml',
    autoLoad: true,
    fields: [
    {name: 'tag'},
    {name: 'content'}
    ],
    listeners: {
    load: function(store, records, option) {
    var datas = {};
    var o = null;
    for (var i = 0; i < records.length; i++) {
    o = records[i].data;
    datas[o.tag] = o.content;
    }
    var xml = new Ext.grid.PropertyGrid({
    title: 'Properties Grid',
    autoHeight: true,
    width: 300,
    source: {},
    renderTo: Ext.getBody()
    });
    xml.setSource(datas);
    }
    }
    });


    and returned json

    {"xml":[
    {"tag":"pic","content":"test"},
    {"tag":"path","content":"x:/test"},
    {"tag":"psst","content":"huks fluks"},
    {"tag":" pic","content":true}
    ]}


    from this, I'm just trying to disable sorting...


  • Hmm...maybe I'm missing something then...according to the API, PropertyGrid has a CM property.

    Here's a code snippet I found out in the forum...maybe you're using it differently

    var Property = Ext.data.Record.create([
    {name: 'property'},
    {name: 'value'}
    ]);
    blankDS = new Ext.data.Store({reader: new Ext.data.XmlReader({}, Property)});
    var cm = new Ext.grid.ColumnModel([{
    header: "Property",
    dataIndex: 'property',
    width:120,
    sortable:false,
    fixed:true
    },{
    header: "Value",
    dataIndex: 'value',
    sortable:false,
    editor:new Ext.grid.GridEditor(new Ext.form.TextField())
    }]);
    grid = new Ext.grid.PropertyGrid('propertiesGrid', {
    ds: blankDS,
    cm: cm,
    enableColLock:true,
    enableColumnMove: false,
    autoExpandColumn:true,
    loadMask: true,
    stripeRows: true,
    autoScroll:false,
    clicksToEdit: 1
    });grid.render();


  • Nice, you're right, that's working :D/

    The only last problem is that there's a sorting at render, it seems. I pass my datas in a non-alphabetical order and, after render, everything is messed up (well, I mean... ordered alphabetically, which I don't want ;) )


    var store = new Ext.data.JsonStore({
    url: 'json.php',
    root: 'xml',
    autoLoad: true,
    fields: [
    {name: 'tag'},
    {name: 'content'}
    ],
    listeners: {
    load: function(store, records, option) {
    var datas = {};
    var o = null;
    for (var i = 0; i < records.length; i++) {
    o = records[i].data;
    datas[o.tag] = o.content;
    }
    var xml = new Ext.grid.PropertyGrid({
    title: 'Properties Grid',
    autoHeight: true,
    width: 300,
    source: {}
    });
    xml.getColumnModel().setConfig([
    {header: 'Names', width:100, sortable: false, dataIndex: 'name', id:'name',allowBlank:true},
    {header: 'Value', width:200, sortable: false, dataIndex: 'value', id:'value',allowBlank:true}
    ]);
    xml.render(Ext.getBody());
    xml.setSource(datas);
    }
    }
    });


    If there's a solution, I will be interested. But while searching on the forum, I found a TreeGrid which match better what I want, so I will stop using the property grid.

    Anyway, thanks!


  • This doesn't work for you?

    var cm = new Ext.grid.ColumnModel([
    {
    header: "Column1",
    width: 100,
    sortable: false
    },{
    header: "Column2",
    width: 100,
    sortable: true
    },{
    header: "Column3",
    width: 100,
    sortable: true
    }]);


  • well, it's a property grid so it has not a Column model like normal Grid. There're only "name" and "value" column...

    This isn't working (:


  • Yes, you're right...I went back and looked at it was 1.x code.

    However, in the 2.2 API it says PropertyGrid has a CM and I found this code which is fairly recent:

    http://extjs.com/forum/showthread.php?t=43203

    var recordGrid = new xg.PropertyGrid({

    ds:recordStore

    ,title:'prop grid'

    ,height:400

    ,stripeRows:true

    ,clicksToEdit:1

    ,enableCtxMenu:true

    ,enableColumnResize:true

    ,source: getProductListData[0]

    });


    ...
    recordGrid.getColumnModel().setConfig([

    // new xg.RowNumberer({}),

    {header: 'Names', width:50, sortable: false, dataIndex: 'name', id:'name',allowBlank:true}

    ,{header: 'Value', width:200, sortable: false, dataIndex: 'value', id:'value',allowBlank:true}

    ]);


  • @euchiyama - that looks like 1.1 code.







    • #If you have any other info about this subject , Please add it free.#
    Your name:
    E-mail:
    Telphone:

    Your comments:


    If you have any other info about disable sorting on property grid , Please add it free.