formrunみたいに「ドラッグアンドドロップで何かしらの成果物を作成する」みたいなHTMLは自分で作れるのだろうか？
と思って色々調べていたら、SortableJSなるものが使えそうだったので使ってみる。
まだ使い始めなので機能とかは全然理解していないけど、メモ程度にここに残していく。予定。
SortableJSとは
以下を見るよろし。サンプルも同ページにたくさんあるので、基本的な機能はここ見れば十分、なはず。
何となく作ってるもの
以下みたいなやつ。
ドラッグアンドドロップで追加できる。
もうちょいまともになったらもうちょいまともに編集する。まだ全然できてないので、Qiitaへの記事更新を頑張るのはソースができたあと｡｡｡
リストの描画
上記のサイト(Githubのやつ)に書いてあるし、あんま難しくないのでここでは書かない。
display:flexを使えば普通に横並びにできる。
リスト間での要素の受け渡し
groupていうプロパティのnameが同じリストは、ドラッグアンドドロップで要素を受け渡すことができる。
でもnameが違う場合でも受け渡したりできるので、ホントのところはよくわからない。
このままだと、要素を渡したときに渡し元のリストから要素が消える。
もし、渡し元のリストから要素を消したくない場合は、pull: 'clone' を指定すればよい。
とりあえずここまで｡｡｡｡詳細はまた随時追加
... to be continue.......