javascript in template question

[Shawn]

I have a grid that has grouping on a field called Group.  Group can be one of 3 values (Required, Optional or PickOne).  I want to have a row template that does different things depending on which group the row is in.

If the row is a Required one then I want it to have a disabled, checked checkbox, if it is optional I want it enable, unchecked checkbox and if it is a pickone then I want it to be a radio button. 

I tried the template below but it threw a invalid template exception.  It was working when I had just the required group (the second <td> that has a select control in it works) but broke when I added the logic to change the first <td> depending on Group.


    <script id="workflowTasksTemplate" type="text/x-kendo-template">
        <tr class="row">
            # if(data.Group == 'Required') { #
                <td><input type="checkbox" disabled='true' checked='true'></td>
            # else if (data.Group == 'Optional') { #
                <td><input type="checkbox" disabled='false' checked='false'></td>
            # else{ #
                <td><input type="radio" id='pickone'></td>
            # } #
            <td>
                <span class='v-workflowtask-meta'>#=task #</span>
            </td>
            <td>
                <select onchange="selectUserChanged(#=data.taskDefId#, this.value)">
                    <option value='#=data.user#'></option>
                    # if(data.Users != null) { #
                    # for (var i=0;i<data.Users.length;i++){ #
                        <option value='#=data.Users[i].UserName#'>#=data.Users[i].UserName#</option>
                    # } } #
                </select>
            </td>
        </tr>
    </script>

[Nikolay Rusev]

Hello Shawn,

You are missing two closing curly brackets from the template. Here is how it should be:

<script id="workflowTasksTemplate" type="text/x-kendo-template">
          <tr class="row">
              # if(data.Group == 'Required') { #
                  <td><input type="checkbox" disabled='true' checked='true'></td>
              # } else if (data.Group == 'Optional') { #
                  <td><input type="checkbox" ></td>
              # } else { #
                  <td><input type="radio" id='pickone'></td>
              # } #
              <td>
                  <span class='v-workflowtask-meta'>#=task #</span>
              </td>
              <td>
                  <select onchange="selectUserChanged(#=data.taskDefId#, this.value)">
                      <option value='#=data.user#'></option>
                      # if(data.Users != null) { #
                        # for (var i=0;i<data.Users.length;i++) { #
                          <option
                            value='#=data.Users[i].UserName#'>
                            #=data.Users[i].UserName#
                          </option>
                      # } } #
                  </select>
              </td>
          </tr>
  </script>

And an example: http://jsbin.com/uFadUGu/1/edit

Regards,
Nikolay Rusev
Telerik

[Shawn]

Well that's embarassing!  Thanks for the help it was driving me crazy.