Getting Invalid Template error when trying to load the Kendo Column Responsive Grid.

[Rahul]

I am getting "Uncaught Error: Invalid template:" while trying to request the ".cshtml" page which contains the Kendo Grid (Column-Responsive). We used column responsive template in this grid. I am looking for the solution for this error since couple of hours now but I do not able to resolve it. Please have a look at the below response error message along with the HTML Code.

 

Uncaught Error: Invalid template:'
<div class="container-fluid" onclick="window.location='http://dev.newsalesbook.abc.com/Account/AccountDetail?AccountID=#=data.AccountID #&BusinessUnitID=#=data.BusinessUnitID #'">
   <div class="row">
      <div class="col-xs">
         <label style="font-size:17px; color:rgb(5,69,126); font-weight:bold">#=nullString(data.Name)#</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">Business Unit:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">#=nullString(data.BusinessUnit)#</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">Account Type:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">#=nullString(data.AccountType)#</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">Account#:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">#=data.AccountNo#</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">Parent Account:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">#=nullString(data.ParentAccount)#</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">OS#:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">#=data.OutsideSalesNo#</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">Outside Sales Name:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">#=nullString(data.OutsideSalesName)#</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">IS#:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">#=data.InsideSalesNo#</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">IS Name:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">#=nullString(data.InsideSalesName)#</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">Date Created:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">#=formatDate(data.DateCreated)#</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">Account Owner:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">#=nullString(data.OwnerName)#</label>
      </div>
   </div>
</div>
' Generated code:'var $kendoOutput, $kendoHtmlEncode = kendo.htmlEncode;with(data){$kendoOutput='\n\n
<div class="container-fluid" onclick="window.location=\'http://dev.newsalesbook.wesco.com/Account/AccountDetail?AccountID='+(data.AccountID )+'&BusinessUnitID='+(data.BusinessUnitID )+'\'">
   \n
   <div class="row">
      \n\n
      <div class="col-xs">\n                <label style="font-size:17px; color:rgb(5,69,126); font-weight:bold">'+(nullString(data.Name))+'</label>\n            </div>
      \n
   </div>
   \n\n
   <div class="row">
      \n
      <div class="col-xs">\n                <label class="label-md-bold">Business Unit:</label>\n            </div>
      \n
      <div class="col-xs">\n                <label class="label-md">'+(nullString(data.BusinessUnit))+'</label>\n            </div>
      \n
   </div>
   \n\n
   <div class="row">
      \n
      <div class="col-xs">\n                <label class="label-md-bold">Account Type:</label>\n            </div>
      \n
      <div class="col-xs">\n                <label class="label-md">'+(nullString(data.AccountType))+'</label>\n            </div>
      \n
   </div>
   \n\n
   <div class="row">
      \n
      <div class="col-xs">\n                <label class="label-md-bold">Account'+$kendoHtmlEncode(</label>
      </div>
      <div class="col-xs">
         <label class="label-md">)+'=data.AccountNo';</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">Parent Account:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">;$kendoOutput+='=nullString(data.ParentAccount)';</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">OS;$kendoOutput+=':</label>\n
      </div>
      \n
      <div class="col-xs">\n                <label class="label-md">'+(data.OutsideSalesNo)+'</label>\n            </div>
      \n
   </div>
   \n\n
   <div class="row">
      \n
      <div class="col-xs">\n                <label class="label-md-bold">Outside Sales Name:</label>\n            </div>
      \n
      <div class="col-xs">\n                <label class="label-md">'+(nullString(data.OutsideSalesName))+'</label>\n            </div>
      \n
   </div>
   \n\n
   <div class="row">
      \n
      <div class="col-xs">\n                <label class="label-md-bold">IS'+$kendoHtmlEncode(</label>
      </div>
      <div class="col-xs">
         <label class="label-md">)+'=data.InsideSalesNo';</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">IS Name:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">;$kendoOutput+='=nullString(data.InsideSalesName)';</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">Date Created:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">;$kendoOutput+='=formatDate(data.DateCreated)';</label>
      </div>
   </div>
   <div class="row">
      <div class="col-xs">
         <label class="label-md-bold">Account Owner:</label>
      </div>
      <div class="col-xs">
         <label class="label-md">;$kendoOutput+='=nullString(data.OwnerName)';</label>
      </div>
   </div>
</div>

[Veselin Tsvetanov]

Hi Rahul,

I have noticed that in the template in question you use the hashtag symbol as a part of the text: Account#: OS#: and IS#:. May I ask you to remove those from the template and test again? The hashtag is used by the Kendo Template syntax and it should be avoided or escaped in the actual Template content.

Regards,
Veselin Tsvetanov
Progress Telerik