0

我有一个带有以下coffeescript jquery代码的应用程序来执行一些ajax调用：

  $('#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 提交搜索字段。第二个是删除选定的记录（使用复选框）。现在我可以删除记录并重定向到列出记录的操作，但搜索参数将丢失（如果用户在删除记录之前过滤了记录），他们将不得不再次过滤记录。

所以我所做的是在删除被称为成功之后，我调用了在搜索字段中提交日期并考虑更新记录。

但是......当没有搜索参数时（当没有搜索完成时）删除工作很好。但是当我进行搜索然后我进行删除时......请求被处理为普通的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 回答