利用すれば、たった1行でテーブルの行をドラッグ&ドロップで入れ替えられるようになります。ライブラリを読み込む必要があります。利用することも可能です。ライブラリを読み込む必要があります。処理を用いて実装されているため、具体的には以下の3ファ...では早速サンプルプログラムで説明していきましょう。例として次のテーブルを利用します。2017年8月25日まだ何も処理をしていないので、この段階では行を入れ替えることはできません。タグをきちんと定義することです。普段これらのタグは省略されることが多いですが、ここでは必要になります。入れ替えられるようになります。属性を指定することです。次の1行を実行すれば完成です。テーブル行のドラッグ&ドロップ【JavaScript】$('#sortdata').sortable();それではこれらを実装したサンプルをご覧ください。列もそのまま入れ替わってしまいます。入れ替え処理が終わった段階で処理を走らせることができれば、この番号を振り直すことができます。そこで、もう少し機能を拡張して、ドラッグ&ドロップの処理が終わったタイミングで、セルの中身を差し替える処理を加えてみましょう。属性「num_data」を一律設定することにします。イベントが発生します。このイベントをバインドすれば、指定列の値を差し替えられるようになります。属性を変更することも可能になります。フォームオブジェクトを操作できるようになると、並び順を考慮してデータベースを更新できたり、とても便利になります。行入れ替えするだけでは何も役に立たないので、機能を拡張することを前提にご利用いただければと思います。えぬじぇいWeb系メインで従事していた元システムエンジニア。現在は個人事業主として独立。Webサイト運営における「困った問題」の解決方法をブログで発信。サイト運営、ポップデザインや動画制作など、パソコンでモノづくりをしている。