title: KendoUI Editor Template Issue With KendoUI Grid
body: <p>I have a KendoUI Grid that is outputting some Foreign Key dropdowns and other fields like dates and for some reason some random text/characters are being added before and after the control is rendered.  In this block below, <code>&lt;$Bw$&gt; &lt;$Bx$&gt;</code> is being output to the browser as text before the select list is rendered followed by <code>&lt;$By$&gt;</code>.</p>
  <pre><code>&lt;td role=&quot;gridcell&quot; data-container-for=&quot;StateProvinceId&quot;&gt;&amp;lt;$Bw$&amp;gt;
  &lt;!--$Bw$--&gt;&amp;lt;$Bx$&amp;gt;&lt;span style=&quot;&quot; class=&quot;k-widget k-dropdown k-header&quot; unselectable=&quot;on&quot; role=&quot;listbox&quot; aria-haspopup=&quot;true&quot; aria-expanded=&quot;false&quot; tabindex=&quot;0&quot; aria-owns=&quot;StateProvinceId_listbox&quot; aria-disabled=&quot;false&quot; aria-readonly=&quot;false&quot; aria-busy=&quot;false&quot;&gt;&lt;span unselectable=&quot;on&quot; class=&quot;k-dropdown-wrap k-state-default&quot;&gt;&lt;span unselectable=&quot;on&quot; class=&quot;k-input&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;span unselectable=&quot;on&quot; class=&quot;k-select&quot;&gt;&lt;span unselectable=&quot;on&quot; class=&quot;k-icon k-i-arrow-s&quot;&gt;select&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;input data-val=&quot;true&quot; data-val-number=&quot;The field StateProvinceId must be a number.&quot; data-val-required=&quot;The StateProvinceId field is required.&quot; id=&quot;StateProvinceId&quot; name=&quot;StateProvinceId&quot; type=&quot;text&quot; value=&quot;0&quot; data-role=&quot;dropdownlist&quot; style=&quot;display: none;&quot; data-bind=&quot;value:StateProvinceId&quot; class=&quot;valid&quot;&gt;&lt;/span&gt;&lt;script&gt;
      jQuery(function(){jQuery(&quot;#StateProvinceId&quot;).kendoDropDownList({&quot;dataSource&quot;:[],&quot;dataTextField&quot;:&quot;Text&quot;,&quot;dataValueField&quot;:&quot;Value&quot;});});
  &lt;/script&gt;&lt;!--$Bx$--&gt;&amp;lt;$By$&amp;gt;
  &lt;!--$By$--&gt;&lt;span class=&quot;field-validation-valid&quot; data-valmsg-for=&quot;StateProvinceId&quot; data-valmsg-replace=&quot;true&quot;&gt;&lt;/span&gt;&lt;/td&gt;
  </code></pre>
  <p>The FK editor template is simply the default.</p>
  <pre><code>@using Kendo.Mvc.UI
  
  @model object
             
  @(
   Html.Kendo().DropDownListFor(m =&gt; m)        
          .BindTo((SelectList)ViewData[ViewData.TemplateInfo.GetFullHtmlFieldName(&quot;&quot;) + &quot;_Data&quot;])
  )
  </code></pre>
  <p>This is happening with all of the fields being rendered that have a KendoUI editor template.</p>
  <p><img src="https://i.stack.imgur.com/J77G2.png" alt="Screenshot of error" /></p>
  <h3>Code for Grid</h3>
  <pre><code>@using Kendo.Mvc.UI
  @model Data.DataModels.Person
  
  @(Html.Kendo().Grid&lt;Data.ViewModels.LicenseVM&gt;()
      .Name(&quot;LicensesGrid&quot;)
      .Columns(columns =&gt;
      {
          columns.ForeignKey(p =&gt; p.StateProvinceId, (System.Collections.IEnumerable)ViewData[&quot;StateProvinces&quot;], &quot;StateProvinceId&quot;, &quot;Name&quot;)
              .Title(&quot;State&quot;);
          columns.ForeignKey(p =&gt; p.LicenseTypeId, (System.Collections.IEnumerable)ViewData[&quot;LicenseTypes&quot;], &quot;LicenseTypeId&quot;, &quot;Name&quot;)
              .Title(&quot;Type&quot;);
          columns.Bound(p =&gt; p.LicenseNumber).Width(150);
          columns.Bound(p =&gt; p.ExpirationDate).Width(150);
          columns.Command(commands =&gt;
          {
              commands.Edit(); // The &quot;edit&quot; command will edit and update data items
              commands.Destroy(); // The &quot;destroy&quot; command removes data items
          }).Title(&quot;&quot;).Width(200);
      })
      .ToolBar(toolBar =&gt;
          {
              toolBar.Create().Text(&quot;Add License&quot;);
          })
      .DataSource(dataSource =&gt; dataSource
          .Ajax()
          .Events(events =&gt; events.Error(&quot;error_handler&quot;))
          .Model(model =&gt;
          {
              model.Id(p =&gt; p.PersonLicenseId);
              model.Field(p =&gt; p.PersonId).Editable(false).DefaultValue(@Model.PersonId);
          })
          .Read(read =&gt; read.Action(&quot;_GetLicenses&quot;, &quot;Person&quot;, new { PersonId = Model.PersonId }))
          .Create(create =&gt; create.Action(&quot;_AddLicense&quot;, &quot;Person&quot;))
          .Update(update =&gt; update.Action(&quot;_EditLicense&quot;, &quot;Person&quot;))
          .Destroy(destroy =&gt; destroy.Action(&quot;_DeleteLicense&quot;, &quot;Person&quot;))
      )
  )
  
  &lt;script type=&quot;text/javascript&quot;&gt;
      function errorHandler(e) {
          if (e.errors) {
              var message = &quot;Errors:\n&quot;;
              $.each(e.errors, function (key, value) {
                  if ('errors' in value) {
                      $.each(value.errors, function () {
                          message += this + &quot;\n&quot;;
                      });
                  }
              });
              alert(message);
          }
      }
  &lt;/script&gt;
  </code></pre>