Last modified date : 2019/02/08

使い方

$.MTAppSortableBatchEdit({
  target: 'created_on',
  update: null
});

オプション設定は下記の通りです。

並び替えると日付の部分が自動で変更されます。

オプション

target(Type : String, Default : 'created_on')

自動変更する日付の種類を指定できます。
公開日の日付を変更する場合は 'created_on'、更新日の日付を変更する場合は 'modified_on' を指定します。 初期値は公開日('created_on')です。

update(Type : Function, Default : null)

update オプションに無名関数を設定すると、ドラッグアンドドロップが完了したときにその関数が実行されます(jQuery UI の Sortable の update イベントで実行されます)。

この関数には、第1引数にイベントオブジェクト、第2引数にjQuery UI オブジェクトが渡されます。詳しくは、Sortable - jQuery UI API 1.8.4 日本語リファレンス - StackTrace 等をご参照ください。

サンプル

次のコードを user.js に書くだけで、MTAppSortableBatchEdit が使えるようになります。

$.MTAppSortableBatchEdit();

また、update オプションを利用すれば、日付は維持したままで、タイトルに連番を振ることで並び替えることも可能です。次のコードを user.js に書くと、ドラッグアンドドロップで並び替えをしたときに日付の自動変更を行わず、ブログ記事のタイトルに上から「1. 」のような連番を自動で付けることができます。

$.MTAppSortableBatchEdit({
  update: function(ev, ui){
    ui.item.parent('tbody').find('td.title input').each(function(idx){
      var val = $(this).val().replace(/^\d+\. /, '');
      idx++;
      $(this).val(idx + '. ' + val);
    });
  }
});

なお、ui.item でドラッグアンドドロップをした行の tr 要素が取得てきます。