0

私はいくつかのajax呼び出しを行うために次のcoffeescriptjqueryコードを持つアプリケーションを持っています:

  $('#records-filter-date').submit ->
$.get(@.action, $(@).serialize(), null,'script')
return false

$('#records-delete').submit ->
 $.post(@.action, $(@).serialize(), (data)->
  $('.check-for-delete:checked').parent().parent().hide(600,'swing')
  $('#alert-div').html("<div class='alert alert-success '><button class='close' data-dismiss='alert' type='button'>x</button><div id='flash_notice'>"+data+ " record(s) successfully deleted!</div></div>")
  $.get('#records-filter-date'.action, $('#records-filter-date').serialize(), null,'script')
,'text')
return false

これで、ページに特定のレコードが一覧表示されます。最初の呼び出しは、ajaxを介して検索フィールドを送信することです。2つ目は、選択したレコードを削除することです(チェックボックスを使用)。これで、レコードを削除して、レコードを一覧表示するアクションにリダイレクトできますが、検索パラメーターが失われ(ユーザーがレコードを削除する前にフィルター処理した場合)、レコードを再度フィルター処理する必要があります。

だから私がしたのは、削除が成功したと呼ばれた後、検索フィールドに日付を送信し、レコードを更新することを考えたということでした。

しかし...検索パラメータがない場合(検索が行われなかった場合)、削除はうまく機能します。しかし、検索を行ってから削除を行うと、リクエストは通常​​のhttpリクエストとして処理されます。

検索パラメータを維持する方法はありますか?または、これを修正するために何かする必要がありますか?

編集:削除するレコードを送信するフォームは、検索呼び出しによって更新されたdiv内にあります。divが更新されたときにajax呼び出しとのバインディングが壊れている可能性がありますか?

4

1 に答える 1

1

削除するレコードを送信するフォームは、検索呼び出しによって更新された div 内にあります。divが更新されると、ajax呼び出しとのバインディングが壊れている可能性がありますか?

はい、それが問題です。要素の HTML コンテンツを置き換えると、その内部にあるすべての既存の要素が DOM から削除され、関連するデータとイベント ハンドラーが一緒に移動します。同じコンテンツに置き換えても、結果として得られる要素は新しいものです。

イベント委任を使用する必要があります。コードの通常の jQuery バージョンは次のとおりです。

$(document).on('submit', '#records-delete', function(e) {
    // your $.post() code here
});

理想的には、ではなくdocument、階層内で動的要素に近い静的要素を使用します (#records-deleteここではフォームが動的要素になります)。あなたの場合、それ<div>はそのフォームを含むのセレクターになります。

于 2013-01-21T13:54:41.467 に答える