0

私のページで JQuery-UI インタラクションを動作させるのに少し問題があります。私は以前に JQuery-UI を使用したことがないので、後でドラッグ アンド ドロップしてソートできるようにすることを期待して、ソート可能な相互作用を試すことから始めました。しかし、私は頭を壁にぶつけていて、ソート可能な作業さえできませんでした。

並べ替えようとしているコンテンツは、ajax で動的に読み込まれています。コンテンツがどのように見えるかを以下に示します。

<ul id="category_list">
    <li class="category" data-category-id="17">Education</li>
    <li class="category" data-category-id="20">General Information</li>
    <li class="category" data-category-id="14">Music / Movies / Television</li>
    <li class="category" data-category-id="18">Navigation</li>
    <li class="category" data-category-id="19">Retailers</li>
    <li class="category" data-category-id="16">Social Media</li>
    <li class="category" data-category-id="15">Web Results</li>
</ul>

この JQuery 関数はデータをロードします。

// load all the engines in a category
$('#container').on("click", ".buttonclass", function() {
    $.get("/categories", {
      id : $(this).attr('data-id')
      }, function(data) {
          var pane = $("#categories").data('jsp');
          pane.getContentPane().html(data);
          pane.reinitialise();
      });
});

(ペイン関連のものは、これが JScrollPane によってスクロール可能であるためです)。上記のこの関数にコードを追加して、リスト要素をソート可能にしようとしましたが、何も機能しません。私が試したいくつかのことは次のとおりです。

$('.category').sortable();
...
$('.category'.each(function(){$(this).sortable()};
...
$("#category_list").sortable();
...
$('.category').sortable('refresh');
...
$('.category'.each(function(){$(this).sortable('refresh')};
...
$("#category_list").sortable('refresh');

($.get の) コールバック関数内とその後の両方で、on click ハンドラーにコードを追加しようとしましたが、うまくいきませんでした。

ページ (JscrollPane 内) にハードコーディングされた静的データは、並べ替えに問題はありません。動的コンテンツだけが問題を引き起こしています。

どんな助けでも大歓迎です。

4

3 に答える 3

0

jqfaq.comで、このjquery-uiのドキュメントと、同じ要素の並べ替えとドラッグを確認してください。うまくいけば、これはあなたを助けるかもしれません。

于 2013-01-09T08:19:56.533 に答える
0

問題を理解し、それはJScrollPaneでした。JScrollpaneは静的データとソート可能/ドラッグ可能/ドロップ可能に問題はありませんが、動的にデータを入力するときに問題が発生するようです。

JScrollPanesを削除し、問題がなければすべて以下を使用して削除しました。

$("#category_list").sortable();
于 2013-01-10T04:56:25.637 に答える
0

理想的には

$("#category_list").sortable();

JqueryUIの並べ替え可能なドキュメントを確認した場合。

于 2013-01-09T08:20:26.870 に答える