Grouping related question?

[businessman332211]

The basic grid was working. I changed the store to a grouping store...adding in group field. then created the view and passed it to the grid. Now it's throwing an error, any advice?

<script type="text/javascript">
/* Code to:
@ Get the grid
@ Show the grid
@ Make filtering functional
*/
Ext.onReady(function(){
 Ext.ux.grid.filter.StringFilter.prototype.icon = 'img/find.png';
 var store = new Ext.data.GroupingStore({
  // load using an HttpProxy
  proxy: new Ext.data.HttpProxy({
   url: '{{$html->url('/admin/revenue_Forecasts/getrevenueforecasts/')}}'+'{{$year_select}}/'+'{{$rfcstate_select}}/'+'{{$currency_select}}/'
  }),
  // create reader that reads the records
  reader: new Ext.data.JsonReader({
   root: 'rows',
   fields: [
      {name: 'subarea'},
      {name: 'name'},
      {name: '1'},
      {name: '2'},
      {name: '3'},
      {name: '4'},
      {name: '5'},
      {name: '6'},
      {name: '7'},
      {name: '8'},
      {name: '9'},
      {name: '10'},
      {name: '11'},
      {name: '12'}
   ]
  }),
  groupField: 'subarea',
  remoteSort: false
 });
 // create the Grid
 var column_model = new Ext.grid.ColumnModel ([
  {id: 'subarea', header: "Subarea", width: 125, sortable: false, dataIndex: 'subarea'},
  {id: 'name', header: 'Practice Name', width: 125, sortable: false, dataIndex: 'name'},
  {id: '1', header: 'Jan', width: 125, sortable: false, dataIndex: '1'},
  {id: '2', header: 'Feb', width: 125, sortable: false, dataIndex: '2'},
  {id: '3', header: 'Mar', width: 125, sortable: false, dataIndex: '3'},
  {id: '4', header: 'Apr', width: 125, sortable: false, dataIndex: '4'},
  {id: '5', header: 'May', width: 125, sortable: false, dataIndex: '5'},
  {id: '6', header: 'Jun', width: 125, sortable: false, dataIndex: '6'},
  {id: '7', header: 'Jul', width: 125, sortable: false, dataIndex: '7'},
  {id: '8', header: 'Aug', width: 125, sortable: false, dataIndex: '8'},
  {id: '9', header: 'Sep', width: 125, sortable: false, dataIndex: '9'},
  {id: '10', header: 'Oct', width: 125, sortable: false, dataIndex: '10'},
  {id: '11', header: 'Nov', width: 125, sortable: false, dataIndex: '11'},
  {id: '12', header: 'Dec', width: 125, sortable: false, dataIndex: '12'}  
 ]);
    var group_view = new Ext.grid.GroupingView({
        forceFit:true,
     groupTextTpl: '{text}'
    }),
 
 var grid = new Ext.grid.GridPanel({
  el: 'audit-data-grid',
  autoFitColumns: true,
  loadMask: true,
  store: store,
  view: group_view,
  cm: column_model,
  stripeRows: true,
  height: 500,
  width: 1300,
  title:'Revenue Forecasts'
 });
 grid.render();
 store.load();
});
</script>
<link rel="stylesheet" type="text/css" href="/css/extcss/auditgrids.css" />
<div id="audit-data-grid"></div>
<br>

[businessman332211]

I am having another problem. The following code is modified so it is more acceptable (correct).
But there are a few things wrong with it.
1. It doesn't work in IE?
2. I don't want it sorting. I basically want to keep it the way it is and just group it with no sorting of any kind (since I already have them ordered the way I need originally).

Without the sorting info it doesn't work in either browser but it throws that same error (sortinfo is null or not an object). Then when the sorting is set (like below) it works fine in firefox but throws an error in IE "Expected string identifier or number".
The thing is as I mentioned I don't want to sort anyway but it doesn't even work in FF without the sorting code added?
Any advice or is there something I am doing wrong?

<script type="text/javascript">
/* Code to:
@ Get the grid
@ Show the grid
@ Make filtering functional
*/
Ext.onReady(function(){
 Ext.ux.grid.filter.StringFilter.prototype.icon = 'img/find.png';
 var store = new Ext.data.GroupingStore({
  // load using an HttpProxy
  proxy: new Ext.data.HttpProxy({
   url: '{{$html->url('/admin/revenue_Forecasts/getrevenueforecasts/')}}'+'{{$year_select}}/'+'{{$rfcstate_select}}/'+'{{$currency_select}}/'
  }),
  // create reader that reads the records
  reader: new Ext.data.JsonReader({
   root: 'rows',
   fields: [
      {name: 'subarea'},
      {name: 'name'},
      {name: '1'},
      {name: '2'},
      {name: '3'},
      {name: '4'},
      {name: '5'},
      {name: '6'},
      {name: '7'},
      {name: '8'},
      {name: '9'},
      {name: '10'},
      {name: '11'},
      {name: '12'}
   ]
  }),
  sortInfo: {field: 'name', direction: 'ASC'},
  groupField: 'subarea',
 });
 // create the Grid
 var column_model = new Ext.grid.ColumnModel ([
  {id: 'subarea', header: "Subarea", width: 125, sortable: false, dataIndex: 'subarea'},
  {id: 'name', header: 'Practice Name', width: 125, sortable: false, dataIndex: 'name'},
  {id: '1', header: 'Jan', width: 125, sortable: false, dataIndex: '1'},
  {id: '2', header: 'Feb', width: 125, sortable: false, dataIndex: '2'},
  {id: '3', header: 'Mar', width: 125, sortable: false, dataIndex: '3'},
  {id: '4', header: 'Apr', width: 125, sortable: false, dataIndex: '4'},
  {id: '5', header: 'May', width: 125, sortable: false, dataIndex: '5'},
  {id: '6', header: 'Jun', width: 125, sortable: false, dataIndex: '6'},
  {id: '7', header: 'Jul', width: 125, sortable: false, dataIndex: '7'},
  {id: '8', header: 'Aug', width: 125, sortable: false, dataIndex: '8'},
  {id: '9', header: 'Sep', width: 125, sortable: false, dataIndex: '9'},
  {id: '10', header: 'Oct', width: 125, sortable: false, dataIndex: '10'},
  {id: '11', header: 'Nov', width: 125, sortable: false, dataIndex: '11'},
  {id: '12', header: 'Dec', width: 125, sortable: false, dataIndex: '12'}  
 ]);
    var group_view = new Ext.grid.GroupingView({
        forceFit:true,
     groupTextTpl: '{text}'
    });
 
 var grid = new Ext.grid.GridPanel({
  el: 'audit-data-grid',
  autoFitColumns: true,
  loadMask: true,
  store: store,
  view: group_view,
  cm: column_model,
  stripeRows: true,
  height: 500,
  width: 1300,
  title:'Revenue Forecasts'
 });
 grid.render();
 store.load();
});
</script>
<link rel="stylesheet" type="text/css" href="/css/extcss/auditgrids.css" />
<div id="audit-data-grid"></div>
<br>

[mjlecomte]

do you just want to disable sorting?
http://extjs.com/deploy/dev/docs/out...efaultSortable

For IE problems check that your code or the response doesn't have a trailing comma.