ExtJs - Problems with grouping in grid ExtJs - Problems with grouping in grid json json

ExtJs - Problems with grouping in grid


post the code of 'get_from_db.php', if you can, please.

$connect = mysql_connect('localhost', 'root', ''); if ($connect) mysql_select_db('grid') or die('error with select table'); $select = mysql_query("select * from test"); while ($rec = mysql_fetch_array($select)) $rows[] = $rec; echo json_encode($rows);

You made mistake in returning JSON. Instead

$rows[] = $rec;

you need

$rows[] = array ("id"=>$rec['id'], "name"=>$rec['name'], "text"=>$rec['text']);


decided. code:

Ext.onReady(function() {var TestStore = new Ext.data.GroupingStore({    url         : 'http://extjs/get_from_db.php',    autoLoad    : true,    remoteGroup : true,    groupField  : 'name',    sortInfo : {        field     : 'id',        direction : 'ASC'    },    reader : new Ext.data.JsonReader({        totalProperty : 'totalCount',        root          : 'items',        idProperty    : 'id',        fields: [            {name : 'id',   type : 'int'},            {name : 'name', type : 'String'},            {name : 'text' ,type : 'String'}        ]    })});var TaskGrid = new Ext.grid.GridPanel({    store    : TestStore,    colModel : new Ext.grid.ColumnModel({        columns : [            {id     : 'id',   header    : 'Id', dataIndex : 'id'},            {header : 'Name', dataIndex : 'name'},            {header : 'Text', dataIndex : 'text'}        ],        defaults : {            sortable     : true,            menuDisabled : false,            width        : 20        }    }),    view : new Ext.grid.GroupingView({        startCollapsed : true,        forceFit     : true,        groupTextTpl : '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'    }),    frame        : true,    width        : 700,    height       : 450,    collapsible  : true,    animCollapse : false,    title        : 'Grouping',    renderTo     : document.body    });});

More details in this note