0

こんにちは、誰かが私が持っているドラッグアンドドロップソート可能なバグを理解するのを手伝ってくれることを願っています. 現在、ドラッグ可能な領域と呼ばれる div 内に含まれる左側の要素があります。右側にドロップゾーンがあります。ドラッグアンドドロップはソート可能で問題なく機能しますが、編集可能な機能を有効にするとソートは機能しませんが、編集可能は問題なく機能します。

ドロップ領域内で編集可能な作業を行うには、追加する必要がありました..

handle: '.sortable-handle'  to  .sortable({})

ただし、このハンドルを有効にすると、並べ替えが停止します。ドロップ領域内で要素をドラッグ/ドロップ、並べ替え、および編集できるようにしたいと考えています。編集可能な機能のためにFroalaテキストエディタを使用しています

これが実際の例です：http://jsfiddle.net/darinnj/bdaerfyq/

誰かがこれを達成するための効率的な方法を持っているかどうか教えてください。

4

1 に答える 1

0

アイテムをドロップした後にアイテムをドラッグするように、jsFiddle をハンドラーで更新しました。http://jsfiddle.net/bdaerfyq/4/

$('.contentTitle:not([data-initialized])').editable({
  initOnClick: true,
  buttons: ['formatBlock', 'blockStyle', 'bold', 'italic', 'underline', 'strikeThrough', 'color', 'align', 'outdent', 'indent', 'createLink', 'undo', 'redo', 'inserthorizontalrule'],
  blockTags: ["h1", "h2", "h3", "h4", "h5", "h6"]
}).attr('data-initialized', true).parent().append('<span class="sortable-handle"></span>');

また、ハンドラーでの伝達を停止して、それ以上エディターに伝達されないようにすることも重要です。

$('body').on('.sortable-handle', function (e) {
    e.stopPropagation();
});
于 2014-09-09T21:07:47.287 に答える