Ruby 在 rails - 加载更多带有 kaminari 和搜索表单的按钮。 Jquery 个问题

Question

我有一个 ajax 搜索表单和 ajax 使用 kaminari 的分页。我想将其更改为 'load more' 按钮，但我在使用 jquery 时遇到了问题。

对于表格和正常的分页，我在我的 index.js.erb 中使用了它；

$('.gig-search-list').html("<%= j render(partial: 'gigs') %>");

这会将所有当前结果替换为搜索表单中的新结果，或者使用 kaminari gem 选择的下一页。

我想让 'load more' 按钮将结果添加到页面底部，但搜索表单的行为仍像以前一样。

在下面的示例中，'load more' 按钮可以正常工作，但搜索表单根本不起作用。

 $('.gig-search-list').append("<%= j render(partial: 'gigs') %>");

然后我试着把它们分开....

$("#gig_search_form").submit(function() {
    $('.gig-search-list').html("<%= j render(partial: 'gigs') %>")
            $('#map').html('<%= j render("map") %>');
});

$(".pagination").click(function(){
        $(".gig-search-list").append("<%= j render(partial: 'gigs') %>");
        $('#map').html('<%= j render("map") %>');
});

这种作品......有点......虽然我必须点击两次，或者提交两次表格才能触发功能。分页部分没有考虑搜索参数，搜索也到处都是。

如何结合这两个功能？使用 .html 作为搜索表单并使用 .append 作为分页？

Answer 1

您可以在 index.js.erb 中检查条件，是否有参数 [:page]。

例如。 index.js.erb

<% if params[:page] %> #if clicked on load more, we will get params[:page]
 $('.gig-search-list').append("<%= j render(partial: 'gigs') %>");
<% else %>
 $('.gig-search-list').html("<%= j render(partial: 'gigs') %>");
<% end %>

当我们点击分页时，我们需要附加结果，因此我们可以很容易地在 js.erb

上检查该条件

Ruby 在 rails - 加载更多带有 kaminari 和搜索表单的按钮。 Jquery 个问题

Ruby on rails - Load more button with kaminari and search form. Jquery problems

javascript

ajax

jquery

ruby-on-rails

kaminari