PDA

View Full Version : GridView columns won't sort correctly despite of correct type



lasseok
16 Dec 2010, 12:48 PM
Hi

I have a gridpanel with the following columns:



columns: [
{header: "Name", width: 130, dataIndex: 'name', sortable: true},
{header: "Manufacturer", dataIndex: 'manufacturer', sortable: true},
{header: "Country", dataIndex: 'country', sortable: true},
{header: "Price", renderer: Ext.util.Format.numberRenderer("0,000"), dataIndex: 'price', sortable: true},
{header: "Max Power (BHP)", type: 'int', dataIndex: 'bhp', sortable: true},
{header: "Drivetrain", dataIndex: 'drivetrain', sortable: true},
{header: "Weight (kg)", dataIndex: 'weight', sortable: true}
]


I want it to sort the numbers right when clicking the header of a column containing numeric values. I've tried setting the value property to 'int' but the data is still sorted as if it strings instead of numbers...

The full code is here (I've built upon the Bookstore ExtJS example, so naming of all the components are book specific and not car specific):

http://gran-turismodb.com/car-db/index2.php


Does anyone have a clue as to what I'm doing wrong?

fay
16 Dec 2010, 2:11 PM
I'm not certain where you got the "type" config option for an Ext.grid.Column, but you should be specifying "type: 'int'" in your JsonReader's fields definition instead.

fay
16 Dec 2010, 2:15 PM
From your code:



Ext.applyIf(config, {
reader: new Ext.data.JsonReader({
root: 'cars',
idProperty: 'carID' // <-- you had a trailing comma here
}, [
{name: 'carID'},
// ... so on
{name: 'bhp', type: 'int'}, // <-- adding the type here should take care of your sorting issue
// ...
])
});

lasseok
16 Dec 2010, 2:30 PM
Yes! That did the trick.

You are totally right, the type shouldn't be on the column but the JsonReader - I got it mixed up, while reading the documentation.

Thank you very much, fay :)

msinn
16 Dec 2010, 2:49 PM
try for the column with numeric values this:

{header: "Price", xtype:'numbercolumn', format:'0,000', dataIndex: 'price', sortable: true},

take a look to the column xtypes and Column subclasses, they have own renderers
http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.Column?member=xtype

you may also take a look to the number formats

http://dev.sencha.com/deploy/dev/docs/?class=Ext.util.Format?member=number