Hi,
For some reason when I try to add a new record to my dataSource ….then refresh the grid for my hierarchical table that uses detailInit,
…. the formatting is bypassed for my new record added to the dataSource.
After I add the new data to the JavaScript array... and refresh the grid, it does repopulate the child or detail grid:
But it doesn't appear to catch the format: "{0:c}"
I don't know why the new value (monetary) is getting bypassed with the format option? Here is my code for the detailInit(e):
functiondetailInitMainGrid(e) {
console.log("IN: detailInitMainGrid()");
var payCodeList = [];
var data = _view.get("interimDS.interimPayrollRecords");
//DEBUG:var data2 = e.data;
$.each(data, function (index, value) {
if (value.payCode != 'Total') { // add NON-TOTAL records to data array//DEBUG://console.log(" LAST NAME:" + value.fullName + " : RECORD ID: " +value.interimPayrollRecordId);
payCodeList.push({
interimPayrollRecordId: value.interimPayrollRecordId,
payCode: value.payCode,
amount: value.amount,
amountHrsMins: value.amountHrsMins,
monetary: value.monetary,
});
}
});
console.log("event data source: ID:" + e.data.interimPayrollRecordId + ", NAME: " + e.data.fullName);
//var detailCell = e.detailCell;//detailCell.css("padding-left", "350px");
$("<div/>").appendTo(e.detailCell).kendoGrid({
dataSource:
{
data: payCodeList,
serverPaging: false,
serverSorting: false,
serverFiltering: false,
filter: { field: "interimPayrollRecordId", operator: "eq", value: e.data.interimPayrollRecordId }
},
scrollable: true,
sortable: true,
pageable: false,
columns: [
{ field: "payCode", title: "Pay Code", width: "110px", attributes: { class: "child-table-details" } },
{ field: "amount", title: "Amount<br/>(HRS)", width: "50px", format: "{0:n}", attributes: { class: "child-table-details" } },
{ field: "amountHrsMins", title: "Amount<br/> (HRS:MIN)", width: "50px", attributes: { class: "child-table-details" } },
{ field: "monetary", title: "Monetary<br/>Amount", width: "50px", format: "{0:c}", attributes: { class: "child-table-details" } }
]
});
}
I did manage to debug through the creation of the child table (in the detailInit(e) function) when I click the little triangle on the left of the parent record, but it seems to bypass the new value I pushed to the JavaScript array structure and prints it out with our the $ or the trailing .00. I don't want to create a custom formatter in javascript, I think the format option for the monetary column should be working... but maybe there is something I am doing that causes it to malfunction or convert it to the monetary or currency format?
Thanks again for your help and patience,
George
1 Answer, 1 is accepted
Rank 2
Iron
Iron
Iron
This is what I had to do to make the format option work, prior to adding it to my dataSource:
var monetary = "234.00"; // the grid thinks its a string after its grabbed as input from a HTML textbox.
var monetaryAsFloat = kendo.parseFloat(monetary); payCodeList.push({
interimPayrollRecordId: value.interimPayrollRecordId,
payCode: value.payCode,
amount: value.amount,
amountHrsMins: value.amountHrsMins,
monetary: kendo.parseFloat(value.monetary)
});
If the value is "234.00" then it seems to not think of it as a float or double... because of the double quotes maybe? I tried it here in a dojo:
Untitled | Kendo UI Dojo (telerik.com)
Now if I could force that to be 234.00 without the "" I would be in business... but how?
var monetary = "234.00"; // the grid thinks its a string after its grabbed as input from a HTML textbox. var monetaryAsFloat = kendo.parseFloat(monetary);