前提・実現したいこと
現在ECサイトを開発中です。現在その操作を基本的にドラッグ&ドロップで実現していますが、
スマートフォン版を作成するにあたり、その操作がUI的に不便だということがわかったため、
スマートフォンでの操作をD&D→選択フォームをタップする方式に変更しようとしています。
発生している問題
操作方式を移行するにあたり、できるだけ処理を共通化したいという思いから、
D&D操作を擬似的に呼び出して実行させたところ、
ドロップ先でエラーとなりました。
該当のソースコード
JavaScript
1 2 // フォーム操作直後に呼び出されるコールバックの中身 3 var status_id = __status_id__; 4 delete __status_id__; 5 6 if (!status_id ) {return;} 7 8 var $drop_to = $("selector_of_droppable"); 9 var func_onDrop = $drop_to.droppable('option', 'drop');// ←Droppable.dropのコールバックを取得 10 11 // 問題の箇所 12 var Dmusic_card = $("selector_of_draggable").clone(true); 13 Dmusic_card.draggable(); 14 func_onDrop(e, Dmusic_card);// ←コールバックの実行 15 });
問題の箇所でDraggableなオブジェクトを作成しているつもりですが、Droppable.dropのコールバックに処理を投げたとき、
通常のjQueryオブジェクトとして扱われているようです。
D&Dで操作した場合はDraggaableというオブジェクトになっていました。
Draggableオブジェクトを作成する手段がわかれば解決すると思われますが、見つかりませんでした。
ご存知の方がいらっしゃいましたらご教示お願いいたします。
補足情報(FW/ツールのバージョンなど)
JavaScript
jQuery
jQuery-UI
エラー
ui.draggable.hasClass is not a function
// drop時に呼び出される処理 // ui.daraggableがundefinedになっているためエラーになります $dom.droppable({ drop: function(e, ui){ if( ui.draggable.hasClass('ignoreclass') ){ return; }
回答2件
あなたの回答
tips
プレビュー