Iterating over object within grid data in the client detail template

[Donna Stewart]

Well, I'm back.  Now I am having trouble displaying an object from the grid data in the client detail template.  This object is returned from the database as a Dictionary in the Controller.  This dictionary is just one data element in the Json being returned.  The dictionary could have one or more key value pairs.  I am using javascript to display this data and something fairly strange is happening.
 First off, here is the client detail template code:

<script id="shipmentDetail-template" type="text/x-kendo-template">
--- lots of template code removed for brevity ---

 # var myVal; var cr = data.CustomerReference; for (var key in cr) { if (cr.hasOwnProperty(key)) { myVal = cr[key]; # #= myVal # , # } } #

</script>

This is what is rendered:
object Object] , This is customer reference 1 , 0c7c9553-c7ba-4d6e-8f8a-11b060ad5db6 , function (){return i} ,
If I just display the key, here's what I get:
_events , ref1 , uid , parent ,

So I am getting other keys and values that I am not expecting.

There is only one element in the dictionary (data.CustomerReference) at this time.  This is what the Json data looks like when it is sent to the view:
"CustomerReference":{"ref1":"This is customer reference 1"}

Remember this is just a small part of the Json data - here is a larger portion of it:

{"Data":[{"ReturnCode":1,"ReturnMessage":"","ShipmentKey":1,"OriginalABFlag":"A","TrackingNumber":"TrackingNumber1","IsGroundTrackingNumber":false,"GroundTrackingNumber":"GroundTrackingNumber1","Carrier":"Carrier1","DomIntlFlag":"A","DutyorTaxInfo":"DutyorTaxInfo1","ShipDate":"\/Date(1372136400000)\/","OpenClosedFlag":"OpenClosedFlag1","ClosedDate":"\/Date(1372136400000)\/","PostCCReports":"PostCCReports1","InvoiceInfo":{"InvoiceKey":1,"InvoiceNumber":"InvoiceNumber1","InvoiceDate":"\/Date(1372136400000)\/"},"ShipperInformation":{"Name":"Name1","Company":"Company1","Address":{"AddressType":"AddressType1","AddressLine1":"AddressLine11","AddressLine2":"AddressLine21","City":"City1","StateProvince":"StateProvince1","PostalCode":"PostalCode1","CountryCode":"CountryCode1"}},"RecipientInformation":{"Name":"Name1","Company":"Company1","Address":{"AddressType":"AddressType1","AddressLine1":"AddressLine11","AddressLine2":"AddressLine21","City":"City1","StateProvince":"StateProvince1","PostalCode":"PostalCode1","CountryCode":"CountryCode1"}},"OriginalInformation":{"Name":"Name1","Company":"Company1","Address":{"AddressType":"AddressType1","AddressLine1":"AddressLine11","AddressLine2":"AddressLine21","City":"City1","StateProvince":"StateProvince1","PostalCode":"PostalCode1","CountryCode":"CountryCode1"}},"PackageInfo":{"Service":"Service1","PackageDescription":"PackageDescription1","Pieces":1,"ActualWeight":{"WeightType":"X","Weight":1,"WeightUnit":""},"BilledWeight":{"WeightType":"X","Weight":1,"WeightUnit":""},"dimensions":{"DimUOM":"DimUOM1","DimLength":"DimLength1","DimWidth":"DimWidth1","DimHeight":"DimHeight1","DimWeight":1,"DimDivisor":"DimDivisor1"}},"PODInfo":{"PODDate":"\/Date(1372136400000)\/","PODSignature":"PODSignature1","MinutesEarlyLate":1},"ChargesInformationList":[],"OriginalAmount":1,"Credits":1,"Refunds":1,"AmountDue":1,"BillingInfo":{"PaymentMethod":"PaymentMethod1","BillToAccount":"BillToAccount1","CarrierZone":"CarrierZone1","ScanImagePage":1,"BundleNumber":"BundleNumber1","PaymentReference":"PaymentReference1","PaymentRefFileName":"PaymentRefFileName1","CostCenter":"CostCenter1","CostCenterMatchType":"CostCenterMatchType1"},"CustomerReference":{"ref1":"This is customer reference 1"},"ShipCarrierReference":{"carrierref1":"This is Carrier Reference 1"},"GMCInfo":{"GMCFee":0,"CostCenterKey":0,"GroupName":null,"InvoiceGroupName":null,"ExpectedDeliveryDate":null,"DisasterExceptionCode":null,"DimDivisor":null,"DocumentType":null}}
----removed for brevity----
],"Total":3,"AggregateResults":null,"Errors":null}

Any help in this matter is very much appreciated!
Thanks,
Donna

[Petur Subev]

Hello Donna,

Basically to make it easier and don't get lost in sharp symbols and expressions I would suggest you to use external function to handle that logic which extracts the fields and the values of that nested object.

Also to avoid getting that fields that are not part of your model ( they are used internally by the MVVM) you need to call the toJSON() method of the mode.

To demonstrate all of this I created an example with the data you provided.

http://jsbin.com/umamog/2/edit


Kind Regards,
Petur Subev
Telerik

[Donna Stewart]

Hi Petur,

Thank you so much for your help.  The toJSON method worked.  I appreciate your advice for calling an external function, and that would be fine if I were needing this for a column to be displayed on the grid.  However, I was trying to display the data in the client detail template.  I used the toJSON method in the javascript in the template and it works!  I think I tried everything but that.  LOL!

Here's the template code I used:

# var cr = data.CustomerReference.toJSON(); var myVal; for (var field in cr) { myVal = cr[field]; # #= myVal # # } #

Thank you again for your help!
Donna