Search code examples
javascriptkendo-uikendo-asp.net-mvckendo-dropdown

Kendo template add space where code is


So I am using this bit of code to create a template for a kendo dropdown list

 <script id="itemTemplate" type="text/x-kendo-template">      
    #if(Text.indexOf('(Deleted)') > -1){#
    <span style="display:none"></span>
    #}else{#
    <span>#:Text#</span>
    #}#    
</script>

The problem here is that the line of code is being interpreted into white space. What I mean is that white space is being added. When I bind a function to the select event and try to get the text of the selected item

function typeChanged(e) {
   console.log(e.item.text());
}
$("#...").data("kendoDropDownList").bind("select", typeChanged);

What console.log return is the text with 2 empty lines above and 2 below. Please refer to picture. So what I want to know is there a way to strip those empty line beside calling the trim function? enter image description here

Additional Info When I added more line of code in the the template it also added an extra line

<script id="itemTemplate" type="text/x-kendo-template">
    #if(Text.indexOf('(Deleted)') > -1){}#  <-- Added this      
    #if(Text.indexOf('(Deleted)') > -1){#
    <span style="display:none"></span>
    #}else{#
    <span>#:Text#</span>
    #}#
</script>

enter image description here

When I completely remove the use of the template

Old:

        @(Html.Kendo().DropDownListFor(m => m)
              .BindTo(list)
              .DataTextField("Text")
              .DataValueField("Value")
              .HtmlAttributes(attributes)
              ...
              .TemplateId("itemTemplate")
              .ValueTemplateId("tagTemplate")
        )

New:

@(Html.Kendo().DropDownListFor(m => m)
              .BindTo(list)
              .DataTextField("Text")
              .DataValueField("Value")
              .HtmlAttributes(attributes)
              ...
              < deleted >
              .ValueTemplateId("tagTemplate")
        )

Console.log() returns fine.

enter image description here


Solution

  • The answer is that Kendo was actually reading the line break once I add it all to one line it worked

    <script id="itemTemplate" type="text/x-kendo-template">#if(Text.indexOf('(Deleted)') > -1){#<span style="display:none"></span>#}else{#<span>#:Text#</span>#}# </script>