Input not editable in ng-sortable container

Question

I have an issue with input elements within a ng-sortable container. The inputs are not editable. however I can attach a click event. The values can be changed via the controller.

Here is a Plunler to illustrate the issue:

http://plnkr.co/edit/pNJD26eJdkuuzJVA0ys8?p=preview

 <div class="sortable-row" as-sortable="sortableOptions" ng-model="itemsList.items1">
     <div ng-repeat="item in itemsList.items1" as-sortable-item>
         <div as-sortable-item-handle>{{item.Label}}
         <input type="text" ng-model="item.label">//can not be edited
         </div>
 </div>

Thanks for the help!

Answer 1

this is because your input is inside the as-sortable-item-handle therefore the clicks events are stopped;

You can try to get your input out of the div like this:

<div ng-repeat="item in itemsList.items1 track by item.Id" as-sortable-item>
    <div as-sortable-item-handle>{{item.Label}}</div>
    <input type="text" ng-model="item.Label">
</div>

Then you can edit the inputs content freely, hope that helps !