ClientTemplate issue with Kendo Grid column

2
votes

I am trying to configure a Kendo Grid column to display and edit a TimeSpan? property (yeah, I know...), but to do do I have mapped the TimeSpan? to a simpler TimeOfDay model, with just Hours, Minutes, and Seconds properties.

I have gleaned little from the Kendo documentation, which in itself is, no other words describe it, pathetic; worthy only of some sloppy little open source project, but relies on forum questions and answers. In other words, only document what people ask, and at that, rely on the free help of forum members. Rant over.

My column definition looks like this:

columns.Bound(p => p.StartTime).ClientTemplate("#if (StartTime != null) {#= Hours + ':' + Minutes #} else {#= '' #} #");

The output from that is

= Hours ':' Minutes

for non-null values and

= ''

for null values.

Please, for the love of God, someone tell me what I'm doing wrong, and as a bonus, refer me to an explanation, not a bunch of bloody unsuitable examples labelled 'Documentation'.

1
kendo-uikendo-grid
Why the the down-vote? This is a perfect;y valid question, not to mention another call for having to cite a reason for down-voting. - ProfK
I agree, if they can't be bothered to explain why/what's wrong then they shouldn't be able to downvote as now it's too easy for people to skim a question, find something they don't like which may be resolved later and then downvote with little thought put into it. Plus how does it help improve the community if they don't provide feedback to prevent a person doing the same thing wrong in the future. - Myzifer

1 Answers

2
votes

The template definition is invalid because the starting # isn't closed. You can try with this:

"#if (StartTime != null) { # #= Hours # : #= Minutes # #} else {#   #}#"

It would be easier to explain if it is split on multiple rows:

"# if (StartTime !=null) { #" +
   "#= Hours # : #= Minutes #" +
"# } else { #" +
    " " +
"# } #"

The the # code # statement is used to embed executable JavaScript code which doesn't output anything. The #= code # statement is used to output raw values (no HTML encoding). The #: code # statement will html encode the output.

Here is a live demo: http://jsbin.com/ecunuh/1/edit