3

このネストされた並べ替え可能なプラグインhttp://mjsarfatti.com/sandbox/nestedSortable/を使用して、コンテンツ管理システムから画像スライドショーを並べ替えています。

html5 ondrop イベントを使用して、ドロップ イベントが発生するたびに並べ替えが ajax ポストを介して保存されるようにしようとしましたが、ドロップしても save_order 関数に移動しません。

HTML:

<div ondrop="save_order(event)" ondragover="return false;>
    <ol class="sortable">
        <li id="list_1" draggable="true" class="mjs-nestedSortable-no-nesting"><div><img src="{image_path}"/></div></li>
        <li id="list_2" draggable="true" class="mjs-nestedSortable-no-nesting"><div><img src="{image_path}"/></div></li>
    </ol>
</div>

JS:

$(document).ready(function(){
    $('.sortable').nestedSortable({
        disableNesting  : 'mjs-nestedSortable-no-nesting',
        handle          : 'div',
        items           : 'li',
        toleranceElement: '> div'
    });
});

function save_order(event)
{
   serialized = $('ol.sortable').nestedSortable('serialize');
    $.post({my_ajax_url}',serialized,function(data){
      alert('save!');
    });
}
4

1 に答える 1