Blank Number field using Extjs - extjs

Question

enter image description hereI have 4 columns, namely Quantity, wastage, cost, Final Cost in a grid. at the last row of my grid, I have to show consolidated Final Cost, and nothing else.
My problem is,in last row Quantity, wastage, and Cost column, 0 is shown, whereas in store data for these column aren't there for last row.
I just want to show empty value on these columns.
data: [{"Name":"Part-0000112-01","Wastage":"4.63","Unit_Cost":"7.00","Quantity":"7.2200","Type":"Fabric","Net_Consumption":"11.8500","totalCost":"82.95"},{"Name":"Part-0000114-01","Wastage":"0.0","Unit_Cost":"1.00","Quantity":"10.0000","Type":"Fabric","Net_Consumption":"10.0000","totalCost":"10.00"},{"Name":"Part-0000116-01","Wastage":"2.0","Unit_Cost":"1.00","Quantity":"10.0000","Type":"Trim","Net_Consumption":"12.0000","totalCost":"12.00",},{"Name":"Part-0000118-01","Wastage":"0.0","Unit_Cost":"0.00","Quantity":"10.0000","Type":"Trim","Net_Consumption":"10.0000","totalCost":"0.00"},{"totalCost":"104.95","Name":"Total Material Costs (InDollar)"}]
Code:
Ext.create('Ext.grid.Panel', {
store: BOMStore,
columns: [{
text: 'Name',
dataIndex: 'name'
}, {
text: 'Quantity',
dataIndex: 'Quantity',
editor: {
xtype : 'numberfield',
allowBlank : false,
listeners : {
change : function(field, newValue,o ,e) {
var quantity = field.value;
var selectedModel = this.up('grid').getSelectionModel().getSelection()[0];
var wastage = selectedModel.get('Wastage');
var unitCost = selectedModel.get('Unit_Cost');
var updateTotalCost = getTotalCost(quantity,wastage,unitCost);
selectedModel.set('totalCost', updateTotalCost);
updateRowCosting(selectedModel);
}
}
}
}, {
text: 'Wastage',
dataIndex: 'Wastage',
editor: {
xtype : 'numberfield',
allowBlank : false,
}
},{
text: 'Cost',
dataIndex: 'Unit_Cost',
editor: {
xtype : 'numberfield',
allowBlank : false,
}
},{
text: 'Total Cost',
dataIndex: 'totalCost',
editor: {
xtype : 'numberfield',
allowBlank : false,
}
}]
});

Answer 1

You can use renderer which can be used as a converter, so you can check if the row is last one and return empty string.
FIDDLE
Ext.create('Ext.grid.Panel', {
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [{
text: 'Name',
dataIndex: 'name'
}, {
text: 'Email',
dataIndex: 'email',
flex: 1
}, {
text: 'Phone',
dataIndex: 'numm',
renderer: function (value, metaData, record, rowIndex, collIndex, store) {
if (store.indexOf(record) === (store.totalCount - 1)) {
return '';
}
return value;
}
}]
});

Answer 2

The issue got resolved.
Below is my model.
fields: [ 'Type', 'matid', 'ebomid' , 'srmid' ,'Name', 'Component_Location','Description',
'Article','Supplier_Item_Label','Supplier_Item_Description','UOM',
{ name: 'Quantity', type: 'float' },{ name: 'Wastage', type: 'float' },'Wastage_Percentage','Net_Consumption','Material_Currency','Target_Cost',
'markupInViewMode',{ name: 'Markup', type: 'float' },'markup_Percentage','Final_Material_Cost','Sourcing_Classification','Brand_Cost','Vendor_Cost','Total_Cost']
});
So, if I give type float/number in Model, and dont pass the data for corresponding columns, then defaults the value to 0.
We got to set the field type in column. xtype : 'numberfield',