This is a migrated thread and some comments may be shown as answers.

[Solved] Razor syntax help in Client Detail Template for Grid

2 Answers 506 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Donna Stewart asked on 21 Jun 2013, 08:02 PM

I have a grid in which I am using the client detail template and I need a little help with the syntax. I am trying to do a fairly simple conditional against an item in the parent grid data. When I start typing the syntax as I think it should be, I get "Preprocessor directives must appear as the first non-whitespace character on a line". Here is what I am typing:

Minutes Early/Late: @if(#: PODInfo.MinutesEarlyLate # > 0){ #: PODInfo.MinutesEarlyLate # Late } else { On Time }

I am fairly new to Razor, and maybe here I need Javascript instead. I have actually tried both, but it is the # syntax with which I think I am having trouble.

Thank you in advance for any help!

Donna

In case - here's the grid

@(Html.Kendo().Grid<GMCRepository.Models.DataServices.ShipmentInformation>().Name("ShipmentList")

.DataSource(dataSource => dataSource

.Ajax()

.Read(read => read.Action("ShipmentInfoList", "DataInquiry"))

)

.Columns(columns =>

{

columns.Bound(shipment => shipment.TrackingNumber);

columns.Bound(shipment => shipment.ShipDate);

columns.Bound(shipment => shipment.ShipperInformation.Address.City);

columns.Bound(shipment => shipment.ShipperInformation.Address.StateProvince);

columns.Bound(shipment => shipment.RecipientInformation.Address.City);

columns.Bound(shipment => shipment.RecipientInformation.Address.StateProvince);

columns.Bound(shipment => shipment.AmountDue);

columns.Bound(shipment => shipment.BillingInfo.BillToAccount);

columns.Bound(shipment => shipment.CustomerReference);

})

.ClientDetailTemplateId("shipmentDetail-template")

)

Here's the client detail template:

<script id="shipmentDetail-template" type="text/x-kendo-template">

<div class="shipment-grid-detail">

<div class="row-fluid">

<div class="span4 shipment-div">

<h4>Shipper Information</h4>

#: ShipperInformation.Name # <br />

#: ShipperInformation.Company # <br />

#: ShipperInformation.Address.AddressLine1 # <br />

#: ShipperInformation.Address.AddressLine2 # <br />

#: ShipperInformation.Address.City #, #: ShipperInformation.Address.State #  #: ShipperInformation.Address.PostalCode #, #: ShipperInformation.CountryCode #

</div>

<div class="span4 shipment-div">

<h4>Recipient Information</h4>

#: RecipientInformation.Name # <br />

#: RecipientInformation.Company # <br />

#: RecipientInformation.Address.AddressLine1 # <br />

#: RecipientInformation.Address.AddressLine2 # <br />

#: RecipientInformation.Address.City #, #: RecipientInformation.Address.State #  #: RecipientInformation.Address.PostalCode #, #: RecipientInformation.CountryCode #

</div>

<div class="span4 shipment-div">

<h4>Shipment Information</h4>

Ship Date: #: ShipDate # <br />

Service: #: PackageInfo.Service # <br />

Packaging: #: PackageInfo.PackageDescription # <br />

Actual Weight: #: PackageInfo.ActualWeight.Weight # #: PackageInfo.ActualWeight.WeightUnit # <br />

Billed Weight: #: PackageInfo.BilledWeight.Weight # #: PackageInfo.BilledWeight.WeightUnit # <br />

Dimensions: #: PackageInfo.dimensions.DimLength # x #: PackageInfo.dimensions.DimWidth # x #: PackageInfo.dimensions.DimHeight # #: PackageInfo.dimensions.DimUOM # <

br />

Pieces: #: PackageInfo.Pieces #

</div>

<div class="row-fluid">

<div class="span4 shipment-div">

<h4>Delivery Information</h4>

POD Date: #: PODInfo.PODDate # <br />

POD Name: #: PODInfo.PODSignature # <br />

Minutes Early/Late: @if(#: PODInfo.MinutesEarlyLate # > 0){ #: PODInfo.MinutesEarlyLate # Late } else { On Time }

</div>

<div class="span4 shipment-div">

<h4>Billing Information</h4>

Payment Option: #: BillingInfo.PaymentOption # <br />

Zone: #: BillingInfo.CarrierZone # <br />

Bill To Account: #: BillingInfo.BillToAccount # <br />

Payment File Ref: #: BillingInfo.PaymentReference # <br />

Closing Run: #: BillingInfo.PaymentRefFileName # <br />

Bundle Number: #: BillingInfo.BundleNumber #

</div>

<div class="span4 shipment-div">

<h4>Charge Information</h4>

<div class="row-fluid">

<div class="span6">

Original Amount: <br />

Credits: <br />

Refunds: <br />

Amount Due:

</div>

<div class="span6">

#: OriginalAmount # <br />

#: Credits # <br />

#: Refunds # <br />

#: AmountDue #

</div>

<div class="row-fluid">

@(Html.Kendo().Grid<GMCRepository.Models.DataServices.ChargesInformation>().Name("ShipmentCharges")

.DataSource(dataSource => dataSource.Ajax().Read(read => read.Action("ChargesList", "DataInquiry"))

)

.Columns(columns =>

{

columns.Bound(charge => charge.ChargeDescription);

columns.Bound(charge => charge.ChargeAmount);

})

.ToClientTemplate())

</div>

<div class="row-fluid">

<div class="span4 shipment-div">

<h4>Cost Center Information</h4>

Cost Center: #: BillingInfo.CostCenter # <br />

Match Type: #: BillingInfo.CostCenterMatchType # <br />

</div>

<div class="span4 shipment-div">

<h4>References</h4>

</div>

</script>

2 Answers, 1 is accepted

Accepted

answered on 24 Jun 2013, 08:38 PM

I figured this out finally! I realized I could not use Razor here, so I switched to JavaScript. It took me a while to figure out the code and syntax, but with the help of a You Tube video by Ricardo Covo I got it working. (Thank you Ricardo!) Here is what I ended up with:

Minutes Early/Late: # if( data.PODInfo.MinutesEarlyLate > 0 ){ # #: PODInfo.MinutesEarlyLate # Late # } else { # On Time # } #

I'm sure I've seen this somewhere in the Kendo docs, but it wasn't obvious to me, so I thought I would post the solution in case anyone else runs into this.

Thanks,
Donna