Question

我创建了一个书签操作，该操作的工作原理是，但是当我单击“书签”或“取消书签”时，它会将我带到不是我想要的显示页面，我希望单击的图标在更改时我单击“书签”和“取消书签”，然后停留在同一页面（即索引页面）上。我看过其他类似的问题，但对我来说它们没有意义，我发现我可能不得不使用一种称为AJAX的东西，但是我对Ruby还是陌生的，不确定如何使用。

这是我的代码，我认为问题与我的link_to有关，但我不确定。

谢谢

index.html.erb文件：

<div id="bookmark">
              <% saved_hairstyle = SavedHairstyle.find_by(user: current_user, hairstyle: hairstyle.id) %>
              <% if saved_hairstyle %>
                <%= link_to saved_hairstyle_path(saved_hairstyle), method: :delete, remote: true do %>
                <!--bookmarked-->
                  <i class="fas fa-bookmark"></i>
                <% end %>
              <% else %>
                <%= link_to hairstyle_saved_hairstyles_path(hairstyle), method: :post, remote: true do %>
                <!--un bookmarked-->
                  <i class="far fa-bookmark"></i>
                <% end %>
              <% end %>
            </div>

saved_hairstyles控制器：

class SavedHairstylesController < ApplicationController
include Pundit
  after_action :verify_authorized, except: [:create, :destroy]

  def create    
    @hairstyle = Hairstyle.find(params[:hairstyle_id])   
    @saved_hairstyle = SavedHairstyle.new(user: current_user, hairstyle: @hairstyle)   
    if @saved_hairstyle.save
      respond_to do |format|         
        format.html { redirect_to hairstyle_path(@saved_hairstyle.hairstyle) }
        format.js  # <-- will render`app/views/saved_hairstyles/create.js.erb`
      end
    else
      respond_to do |format|
        format.html { render 'hairstyles' }
        format.js  
      end
    end
  end

  def destroy

    @saved_hairstyle = SavedHairstyle.find(params[:id])

    @saved_hairstyle.destroy
    @hairstyle = @saved_hairstyle.hairstyle
    respond_to do |format|
      format.html { redirect_to hairstyle_path(@saved_hairstyle.hairstyle)}
      format.js
    end
  end
end

create.js.erb文件，当有人为发型添加书签时执行：

plusCircle = document.getElementById("bookmark");
plusCircle.innerHTML = `<%= link_to  hairstyle_saved_hairstyles_path(hairstyle), method: :delete do %>
                    <i class="fas fa-plus-circle"></i>
                 <% end %>`

Answer 1

实施有很多问题。解释解决方案是不可行的。

我创建了一个PR https://github.com/Angela-Inniss/hair-do/pull/35，可以帮助您理解。

如果您想了解所做的更改，请随时添加PR评论。如果您仍然遇到书签问题，也可以通过https://twitter.com/amit_savani与我联系

想要我的书签操作有效并停留在同一页面上而不呈现新页面，不确定正确的link_to帮助者

1 个答案: