1. #1
    Ext User
    Join Date
    Oct 2009
    Posts
    2
    Vote Rating
    2
    jeffi is on a distinguished road

      1  

    Default How do I disable sorting in a TreeGrid?

    How do I disable sorting in a TreeGrid?


    I am trying to disable the initial sorting of record as they are added to the tree as well as remove the sorting indicators in the column headers.

    I have tried adding "sortable: false" to the column configurations but that does not do it.

    Is there a simple way to disable sorting altogether in the TreeGrid, I want to define the order myself.

    Here is a simple example of what I am doing:

    <code>
    <html>
    <head>
    <title>Disable sort in Ext-JS TreeGrid</title>
    <!-- ext css includes -->
    <link rel="stylesheet" type="text/css" href="js/ext-3.1.0/resources/css/ext-all.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="js/ext-3.1.0/examples/ux/treegrid/treegrid.css" rel="stylesheet" />
    <!-- ext javascript includes -->
    <script type="text/javascript" src="js/ext-3.1.0/adapter/ext/ext-base-debug.js?build=20100108.103511"></script>
    <script type="text/javascript" src="js/ext-3.1.0/ext-all-debug.js?build=20100108.103511"></script>
    <script type="text/javascript" src="js/ext-3.1.0/examples/ux/treegrid/TreeGridSorter.js"></script>
    <script type="text/javascript" src="js/ext-3.1.0/examples/ux/treegrid/TreeGridColumnResizer.js"></script>
    <script type="text/javascript" src="js/ext-3.1.0/examples/ux/treegrid/TreeGridNodeUI.js"></script>
    <script type="text/javascript" src="js/ext-3.1.0/examples/ux/treegrid/TreeGridLoader.js"></script>
    <script type="text/javascript" src="js/ext-3.1.0/examples/ux/treegrid/TreeGridColumns.js"></script>
    <script type="text/javascript" src="js/ext-3.1.0/examples/ux/treegrid/TreeGrid.js"></script>
    </head>
    <body>
    <div id="treegrid"></div>
    <script type="text/javascript">
    Ext.onReady(function(){
    var treegrid = new Ext.ux.tree.TreeGrid({
    width: 200,
    renderTo: "treegrid",
    enableDD: true,
    defaultSortable: false,
    columns:[{
    id: 'name',
    header: 'Names',
    width: 200,
    dataIndex: 'name',
    sortable: false
    }]
    });
    var root = new Ext.tree.TreeNode({
    text: 'Lists',
    draggable: false,
    sortable: false,
    id: 'root'
    });
    treegrid.setRootNode(root);
    root.appendChild([{ "leaf":true, "name":"B" },
    { "leaf":true, "name":"A" },
    { "leaf":true, "name":"C" }]);
    });
    </script>
    </body>
    </html>
    </code>

  2. #2
    Sencha User
    Join Date
    Sep 2009
    Location
    Calgary, Alberta, Canada
    Posts
    638
    Vote Rating
    2
    CrazyEnigma is on a distinguished road

      0  

    Post


    I think there is a way to specify the sort algorithm instead of disabling it.
    http://www.extjs.com/deploy/dev/docs...ree.TreeSorter

  3. #3
    Ext User
    Join Date
    Oct 2009
    Posts
    2
    Vote Rating
    2
    jeffi is on a distinguished road

      1  

    Thumbs up


    Thanks for your reply CE. When I looked up the TreeSorter as you suggested, I noticed that it is only loaded if the config option 'enableSort' is set to true (default).

    I was able to add it to my config (and set to false), and the sorting disappeared as well as the sort indicators in the column headers:

    var treegrid = new Ext.ux.tree.TreeGrid({
    width: 200,
    renderTo: "treegrid",
    enableDD: true,
    defaultSortable: false,
    enableSort: false, // disable sorting
    columns:[{
    id: 'name',
    header: 'Names',
    width: 200,
    dataIndex: 'name',
    sortable: false
    }]
    });

    Thanks for the direction. It solved my problem.

  4. #4
    Ext User
    Join Date
    Oct 2009
    Posts
    16
    Vote Rating
    0
    hello is on a distinguished road

      0  

    Default


    is there a way to disable sorting for individual columns?

  5. #5
    Sencha User sideeque's Avatar
    Join Date
    Aug 2009
    Location
    Washington DC
    Posts
    50
    Vote Rating
    2
    sideeque is on a distinguished road

      0  

    Default


    If I enable sorting, it takes as "string" sorting. How do I specify for INTEGER?


    My Store

    var store = new Ext.ux.data.PagingArrayStore({
    fields: [{
    name: 'task'
    }, {
    name: 'duration'
    }, {
    name: 'user'
    }],
    data: [],

    lastOptions: {
    params: {
    start: 0,
    limit: 10
    }
    }
    });

    Tree Configuration

    var tree = new Ext.ux.tree.TreeGrid({
    title: 'Core Team Projects',
    width: 500,
    height: 300,
    renderTo: Ext.getBody(),
    enableDD: true,
    //defaultSortable: false,
    //enableSort: false,
    columns:[{
    header: 'Task',
    dataIndex: 'task',
    width: 200
    },{
    header: 'Duration',
    width: 100,
    dataIndex: 'duration',
    align: 'center'
    },{
    header: 'Assigned To',
    width: 200,
    dataIndex: 'user'
    }]
    });




    I tried with type: 'float' with grid culumn configuration and also for Store configuration. It didn't work.

    Any other idea to make it INTEGER sort

  6. #6
    Sencha User
    Join Date
    Jul 2013
    Posts
    1
    Vote Rating
    0
    zulbiadi is on a distinguished road

      0  

    Default


    I get an error script in this line

    renderTo: "treegrid",
    enableDD: true,
    defaultSortable: false,
    columns:[{
    id: 'name',
    header: 'Names',
    width: 200,
    dataIndex: 'name',
    sortable: false

    but i still don't know how to better it, please check it again

    http://freedownloadgratise.blogspot.com/