0

リストを並べ替えることができるように、jquery-uiを使用してWebサイトを実装しています。

jQuery(".folder ul").sortable( { 
    opacity: 0.6, 
    cursor: 'move',
    update: sortUpdate,
    distance: 15,
    items: "> li:has(a)",
} );

list要素は、要素が含まれている場合にのみソート可能である必要があります。ここまでは順調ですね。

並べ替え可能なアイテムにはリンクが含まれているため、並べ替え可能なアイテムをドロップすると、リンクが呼び出されます（onclickイベントとして処理されるためだと思いますか？）。ユーザーが現在ドラッグしているかどうかを確認しながら、クリックイベントを自分で処理する新しいonclickハンドラーを作成しようとしました。ただし、これは機能しません。

jQuery('.folder-used').click(function(event) {
    event.stopPropagation();
event.preventDefault();
});

自分のクリックハンドラーにブレークポイントを設定すると、クリックするとコードに到達したことが示されます。しかし、ページはとにかくリダイレ​​クトします。私の推測では、それは私が使用しなければならないトマホークコマンドリンクのせいです。Tomahawkは、送信アクションを処理するための独自のjavascript関数を生成します。

<t:commandLink action="#{dataHandler.filterChanged}">
<f:param name="id" value="#{val}" />
<img:generateTextImage height="182" width="50" value="#{val}" verticalAligned="true" xpos="54" ypos="29" />
</t:commandLink>

この問題を解決するにはどうすればよいですか？tomahawkのonclickイベントをどのように処理できるか誰かが知っていますか？

事前にThx！Zerd

PS私はここ（ソート可能な開始イベントと停止イベント）またはここ（リンクのクリックイベントを無効にする）で説明されているようなさまざまなアプローチを試しました

4

1 に答える 1

0

私は自分の問題に対する答えを見つけました。

現在ドラッグしているかどうかを示す変数を保持しています

jQuery(".folder ul").sortable( { 
    opacity: 0.6, 
    cursor: 'move',
    update: sortUpdate,
    distance: 15,
    items: "> li:has(a)",
    start: function(event, ui) {
       dragging = true;     
    }
} );

commandLink onclickイベントで、ドラッグしているかどうかを確認します。もしそうなら、私は変数をfalseにリセットし、draggingfalseを返すので、tomahawkアクションは呼び出されません。

<t:commandLink onclick="if(dragging) { dragging = false; return false; }" action="#{handler.filterChanged}">

tomahawkは私のonclickコードを受け取り、それを独自のコードの前に置きます。そのreturn false;場合、トマホークコードが無視されることを確認します。

于 2012-10-11T13:51:42.833 に答える