detailInit: new record is bypassed by format option

1 Answer 38 Views
Data Source Grid
George
Top achievements
Rank 2
Iron
Iron
Iron
George asked on 19 Sep 2023, 03:48 PM

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

 

George
Top achievements
Rank 2
Iron
Iron
Iron
commented on 19 Sep 2023, 04:35 PM

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?

George
Top achievements
Rank 2
Iron
Iron
Iron
commented on 19 Sep 2023, 05:50 PM

Ok... using kendo.parseFloat() worked:


var monetary = "234.00"; //  the grid thinks its a string after its grabbed as input from a HTML textbox.
var monetaryAsFloat =  kendo.parseFloat(monetary); 


1 Answer, 1 is accepted

Sort by
0
Accepted
George
Top achievements
Rank 2
Iron
Iron
Iron
answered on 13 Oct 2023, 07:59 PM | edited on 13 Oct 2023, 08:03 PM

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); 
In my actual code I did it this way:
payCodeList.push({

    interimPayrollRecordId: value.interimPayrollRecordId,
    payCode: value.payCode,
    amount: value.amount,
    amountHrsMins: value.amountHrsMins,
    monetary: kendo.parseFloat(value.monetary)

});

Tags
Data Source Grid
Asked by
George
Top achievements
Rank 2
Iron
Iron
Iron
Answers by
George
Top achievements
Rank 2
Iron
Iron
Iron
Share this question
or