2017-02-10 27 views
1

Я использую модуль ngDraggable, и все работает нормально, за исключением того, что поля ввода отключены, когда они помещаются внутри перетаскиваемых div. Мне нужно, чтобы они оставались редактируемыми, чтобы пользователь мог вводить текст.AngularJS, ngDraggable - поле ввода не редактируется внутри элемента draggable

я раздвоенный существующую скрипку в демонстрационных целях http://jsfiddle.net/kkyk0j4x/10/

<div ng-app="test" ng-controller="testCtrl"> 
<div id="container"> 
    <div class="shape" ng-draggable='dragOptions'> 
     <input type="text" /><!--THIS IS NOT EDITABLE--> 
    </div> 
    <br/> 
    <br/> 
    <br/> 
    <input type="text"><!--THIS IS EDITABLE--> 
</div> 

Не совсем уверен, где проблема приходит и как это исправить. Любая помощь приветствуется.

ответ

2

Я нашел, откуда возникла проблема, и надеюсь, что это поможет кому-то. Внутри модуля ngDraggable есть функция preventDefault в событии mouseDown.

Просто прокомментируйте, что строка и ваши поля ввода внутри ваших перетаскиваемых элементов в HTML станут доступны для редактирования.

// Bind mousedown event 
elem.on('mousedown', function (e) { 
    //e.preventDefault(); 
....... 

UPD (@Andremoniy): в последней версии плагина ngDraggable это место находится в функции onlongpress:

  var onlongpress = function(evt) { 
       if(! _dragEnabled)return; 
       //evt.preventDefault(); <---- this line 
+0

В последней версии библиотеки это необходимо, чтобы быть прокомментировал функцию 'onlongpress'. – Andremoniy