title: Kendo sortable : cannot edit text input inside of the sortable table
body: <p>I have following sortable table with sortable rows by using:</p>
  
  <p><a href="http://demos.telerik.com/kendo-ui/sortable/events" rel="nofollow noreferrer">http://demos.telerik.com/kendo-ui/sortable/events</a></p>
  
  <pre><code>&lt;tbody class="playlist" kendo-sortable k-placeholder="placeholder" k-hint="hint"&gt;
      &lt;!-- IF NOTHING IS FOUND--&gt;
      &lt;tr ng-if="projectDetail.projectOrderViewConfiguration.projectEntries.length == 0"&gt;
          &lt;td colspan="9"&gt;&lt;h1&gt;{{ 'ADD_SOME_ITEMS_FROM_LEFT_COLUMN' | translate }}&lt;/h1&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;!-- ELSE WRITEOUT--&gt;
      &lt;tr  ng-repeat="projectEntry in projectDetail.projectOrderViewConfiguration.projectEntries"&gt;
          &lt;td&gt;
          &lt;input type="text" ng-model="projectEntry.entry.defaultName"  class="form-control" id="cwConnectorTeam" value="{{entry.defaultName}}" /&gt;
          &lt;/td&gt;
          &lt;td&gt;
          &lt;input type="text" ng-model="projectEntry.projectLabel"  class="form-control" id="cwConnectorTeam" value="{{entry.defaultName}}" /&gt;
          &lt;/td&gt;
          &lt;td&gt;&lt;a ng-click="removeProjectEntryItem('{{projectEntry.id}}')"&gt;remove&lt;/a&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;!-- ELSE WRITEOUT--&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p>and JS</p>
  
  <pre><code>// MAKE SELECTED ENTRIES SORTABLE
  $scope.placeholder = function(element) {
      return element.clone().addClass("placeholder").text("drop here");
  };
  $scope.hint = function(element) {
      return element.clone().addClass("hint");
  }; 
  </code></pre>
  
  <p>Problem is that if I tried to click on input filed I found that is not editable (maybe some z-index layer on high position).</p>
  
  <p>I would like to have sortable and editable rows together. How can I solve it?</p>