[CLOSED] Ext.form.NumberField, allowDecimals bug

[Ram Manoj]

I have recently upgraded my application to Ext 1.1.1 from Ext 1.0.1

I am using Ext.form.NumberField in an EditGrid,
I have noticed,

NumberField is giving precision of 2, instead of no precision when using Ext 1.0.1

To remove precision/decimals for the NumberField, I have used
allowDecimals: false,
or
allowDecimals: true,
decimalPrecision: 0, config options. But they are not working.

Please guide me.

[mystix]

please post details as per 8887. thanks.

[Ram Manoj]

Hi Mark,

Here is the complete info.

a. [1.1.1] NumberField decimal precision Bug
b. ext-base.js
c. windows xp
d. IE6

e. I am using Ext.form.NumberField in an EditGrid. I have noticed, NumberField is showing default precision of 2(expected), instead of no precision when using Ext 1.0.1.

To remove precision/decimals for the NumberField, I have used allowDecimals: false.The following is a column code in a Editor Grid.


{
header: 'Charge',
width: 100,
align: 'center',
sortable: false,
inputType: 'number',
dataIndex: 'charge',
editor: new Ext.grid.GridEditor(
new Ext.form.NumberField(
{
allowBlank:false,
allowDecimals: false
}
)
)
}
decimalPrecision: 0, Both of them are not working(to the expected behavior).


{
header: 'Charge',
width: 100,
align: 'center',
sortable: false,
inputType: 'number',
dataIndex: 'charge',
editor: new Ext.grid.GridEditor(
new Ext.form.NumberField(
{
allowBlank:false,
decimalPrecision: 0
}
)
)
}

(I got no javascript error).

Here is clip for the column in the Editor Gridhttp://img137.imageshack.us/img137/4279/numberfieldingridlq1.jpg

I will be glad to provide more info if necessary.
Thanks in advance.

[mystix]

hmm... either

the JSON value for that column is returned with 2 decimal places
your renderer isn't doing it's job of correctly formatting the value for display
(a) + you're missing a column renderer.


allowDecimals: false is the correct configuration to use btw.
That's what i'm using in my own grid for integer values.

p.s. i'm also not exactly sure what you're trying to say.
are your numeric values displaying in the NumberField cells correctly when in non-edit mode, but incorrectly while in edit-mode? :-/

[Ram Manoj]

Hi Mark,

Thanks for the reply.



p.s. i'm also not exactly sure what you're trying to say.
are your numeric values displaying in the NumberField cells correctly when in non-edit mode, but incorrectly while in edit-mode? :-/

Numeric values are displayed correctly when I load the grid. (numeric value being loaded is integer).

When in edit-mode, if I enter integer value(2400) and move the tab to next field, It renders as decimal value (2400.00).

Also if I want to actually have the column type as 'decimal' and with any specific precision.
I am not able to do that either with
'decimalPrecision' : 3

I suppose this has to do with the 'render' function for the NumberField.

But here as code posted above, I have not included any separate 'render' for the column in grid.

If these are working properly for you? I couldn't sort where the problem lies with my code with [1.1.1]?

:-/

[Ram Manoj]

Hi Marc(mystix),

Please don't ignore this thread/bug report.

I am still awaiting your reply.

If there is any likely delay to take this up/ to reply, please let me know.

Anyone down here at Ext, if you come across this thread/posts please put down your thoughts/suggestions.

[fay]

Ram,

I'm not sure what's wrong with your ext1.1.1, but it works for me.

Taking the edit-grid example, I changed the Column Model config for the Price field:


},{
header: "Price",
dataIndex: 'price',
width: 70,
align: 'right',
editor: new Ed(new fm.NumberField({allowDecimals: false}))
},{

and modified the Plant record definition:


{name: 'price', type: 'int'},

and it worked fine!

[Ram Manoj]

Hi Fay,

Thankyou for the reply.

I have checked with the example and its AB right and working spot on.

I tried to emulate as in the example, but could not immediately figure what could make the
grid script work.

I have juggled with Ext.data.Record.create, but of not much avail.

Here is my complete grid code.



var BillingGridUI = function() {

var ds; //hold our data
var grid; //component
var columnModel; // definition of the columns
var dsClient;
var gridForm;

function setupDataSource() {
var bill = new Ext.data.Record.create(
[
{name: 'serviceId'},
{name: 'service'},
{name: 'particular'},
{name: 'charge',type:'int'}
]
);
ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'/ca/BillingCPAction.do?action=preBill'}),//&sysCpId='+window.sysCpId
reader: new Ext.data.JsonReader(
{root: 'data', id: 'serviceId'},
/*[
{name: 'serviceId'},
{name: 'service'},
{name: 'particular'},
{name: 'charge',type:'int'}
]*/
new Ext.data.Record.create(
[
{name: 'serviceId'},
{name: 'service'},
{name: 'particular'},
{name: 'charge',type:'int'}
]
)
)
}
);
ds.load();
}


function getColumnModel() {
if(!columnModel) {
columnModel = new Ext.grid.ColumnModel(
[
{
header: '#',
width: 22,
sortable: false,
dataIndex: 'serviceId'
},

{
header: 'Services',
width: 200,
sortable: false,
align: 'left',
dataIndex: 'service'
/*
editor: new Ext.grid.GridEditor(
new Ext.form.TextField(
{
allowBlank:false,
validator: validateNumber
}
)
)*/
},

{
header: 'Particulars',
width: 200,
sortable: false,
align: 'center',
dataIndex: 'particular',
editor: new Ext.grid.GridEditor(
new Ext.form.TextArea(
{
allowBlank:false,
grow:false,
height: 40
}
)
)
},

{
header: 'Charge',
width: 100,
align: 'center',
sortable: false,
inputType: 'number',
dataIndex: 'charge',
editor: new Ext.grid.GridEditor(
new Ext.form.NumberField(
{
allowBlank:false,
allowDecimals: false
}
)
)
}
]
);
}
return columnModel;
}

function buildGrid() {
gridForm = new Ext.BasicForm(
Ext.get("BillingForm"),
{

}
);

grid = new Ext.grid.EditorGrid(
'billingGrid',
{
ds: ds,
cm: getColumnModel(),
clicksToEdit: 1,
//autoSizeColumns: true,
selModel: new Ext.grid.RowSelectionModel({singleSelect:true})
}
);

grid.render();
}



return {
init : function() {
setupDataSource();
buildGrid();
},

getDataSource: function() {
return ds;
},

loadAndRender: function() {
ds.baseParams = { sysCpId: window.sysCpId};
ds.load();
grid.getView().refresh();
//grid.render();
//alert("");
},

loadBill: function() {
ds.baseParams = { sysBillId: document.BillingForm.maxBillNo.value};
ds.load();
grid.getView().refresh();
},

getGrid: function(){
return grid;
},

getGridForm: function(){
return gridForm;
},

reset: function(){
ds.removeAll();
}
}
}();

Ext.onReady(BillingGridUI.init, BillingGridUI, true);



Anyway its Diwali time, and will be back in 2 days.

Hoping of any positive suggestions when back.

Thankyou.

[mystix]

@Ram Manoj, i'm not ignoring this thread. i'm bogged down with stuff. :)

tidied your code


var BillingGridUI = function() {
var ds; //hold our data
var grid; //component
var columnModel; // definition of the columns
var dsClient;
var gridForm;

function setupDataSource() {
var bill = new Ext.data.Record.create([
{name: 'serviceId'},
{name: 'service'},
{name: 'particular'},
{name: 'charge', type: 'int'}
]);

ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: '/ca/BillingCPAction.do?action=preBill'
}),
reader: new Ext.data.JsonReader(
{root: 'data', id: 'serviceId'},
new Ext.data.Record.create([
{name: 'serviceId'},
{name: 'service'},
{name: 'particular'},
{name: 'charge',type:'int'}
])
)
});

ds.load();
}



function getColumnModel() {
if (!columnModel) {
columnModel = new Ext.grid.ColumnModel([
{
header: '#',
width: 22,
sortable: false,
dataIndex: 'serviceId'
},

{
header: 'Services',
width: 200,
sortable: false,
align: 'left',
dataIndex: 'service'
},

{
header: 'Particulars',
width: 200,
sortable: false,
align: 'center',
dataIndex: 'particular',
editor: new Ext.grid.GridEditor(
new Ext.form.TextArea(
{
allowBlank:false,
grow:false,
height: 40
}
)
)
},

{
header: 'Charge',
width: 100,
align: 'center',
sortable: false,
inputType: 'number',
dataIndex: 'charge',
editor: new Ext.grid.GridEditor(
new Ext.form.NumberField(
{
allowBlank:false,
allowDecimals: false
}
)
)
}
]);
}

return columnModel;
}

function buildGrid() {
gridForm = new Ext.BasicForm(Ext.get("BillingForm"), {
});

grid = new Ext.grid.EditorGrid('billingGrid', {
ds: ds,
cm: getColumnModel(),
clicksToEdit: 1,
selModel: new Ext.grid.RowSelectionModel({
singleSelect:true
})
});

grid.render();
}

return {
init : function() {
setupDataSource();
buildGrid();
},

getDataSource: function() {
return ds;
},

loadAndRender: function() {
ds.baseParams = { sysCpId: window.sysCpId};
ds.load();
grid.getView().refresh();
},

loadBill: function() {
ds.baseParams = { sysBillId: document.BillingForm.maxBillNo.value};
ds.load();
grid.getView().refresh();
},

getGrid: function(){
return grid;
},

getGridForm: function(){
return gridForm;
},

reset: function(){
ds.removeAll();
}
}
}();

Ext.onReady(BillingGridUI.init, BillingGridUI, true);


the portion in red is incorrect. it should simply be


[
{name: 'serviceId'},
{name: 'service'},
{name: 'particular'},
{name: 'charge', type: 'int'}
]


you probably made a copy/paste error while adapting from the examples?

[Ram Manoj]

Thankyou marc(mystix).

Anyway how to address you 'msytix' or 'marc'?

I was at a dilemma, whether to use Ext.data.Record.create instead of array notation after seeing the [1.1.1] grid example.

But using Ext.data.Record.create did not create any problem, and worked the same way.

And there is some good news for me.
My problem with allowDecimals of NumberField is solved on a thorough recheck.

(Probably with a jumble of script files).

Sorry folks for your time.

Can anyone tell me how to close this thread.
i.e., change thread title as [1.1.1][CLOSED] My Bug Title

[mystix]

just edit the first post, click "Go Advanced", then change prepend "[CLOSED]" to the thread title and you're done.