Question

我是Ruby on Rails / Javascript的新手 - 所以请温柔。（使用Rails 3，Jurby，Ruby 1.8.6）

我想创建一个功能，将信息呈现给当前页面，但在不同的部分，当它点击一个链接时 - 比如扩展用户的详细信息，而不必转到特定的用户配置文件。

目前，我的示例将当前用户带到链接的用户个人资料，但我希望信息显示在用户Feed的右侧。（我会包括一个屏幕抓取，但我没有足够高的代表）。因此，想象一下，页面右侧有一个用户帖子，用于显示每个用户的所有全局帖子。在左侧应该是一个信息框，当用户从关联的帖子中点击其用户名时，该信息框会填充用户摘要。

目前，我的views / pages / home.html.erb（呈现部分名为signed_in）

<div class="article_feed">
    <div class="article_snippet">
        <%= form_for(@micropost) do |f| %>
            <%= render 'shared/error_messages', object: f.object %>
            <div class="field">
                <%= f.text_area :content, placeholder: "Got anything to say...?" %>
            </div>
                <%= f.submit "Post", class: "btn btn-large btn-primary" %>
        <% end %>   
        Communicator.. (<%= Micropost.count %>)
    </div>

    <% @microposts.each do |mp| %>
        <div class="article_snippet">               
            <%= render mp %>
        </div>
    <% end %>
    <%= will_paginate @microposts%>     
</div>  

<div class="comments_feed">
    <div class ="comments_snippet">
        <!-- this is where I want information to be displayed, once
                a link has been clicked --> 
    </div>
</div>

我的主页控制器方法

  def home
      @micropost = current_user.microposts.build if signed_in?
      @microposts = Micropost.paginate(page: params[:page], 
              :per_page => 4).order('id DESC') if signed_in?
  end

用户使用自己的模型，控制器和视图来表示，相关的Micropost也是如此。此时，我想要在页面右侧显示的是链接用户的用户名。这个的关键特征是在点击每个帖子底部的每个用户名链接时呈现此信息。理想情况下，我想在不刷新整个页面的情况下实现这一目标。

我已经花了几天时间考虑过这个问题，但我的知识/能力目前是有限的 - 任何帮助都会很棒！谢谢！

Answer 1

这对于一些javascript或jQuery来说是一个很好的任务。看起来你是Rails的新手，所以我将从js和css内联开始，一旦你理解它是如何工作的，你就可以将它移动到正确的位置。

首先在comments_snippet div中获取所需内容，以便页面看起来像是要在点击链接后查看。然后更改comments_feed：

<div class="comments_feed" id="comments" style="display: none;">

刷新页面，并验证div是否显示。然后在视图的顶部添加一些javascript来显示：

<script type="text/javascript">
    function show() {
        document.getElementById("comments").style.display = "block";
    }
</script>

然后添加一个链接来调用它：

<%= link_to "Show comments", "javascript:void(0)", onclick: "show()" %>

在真实应用中，您可以使用js库（如jQuery或css过渡）来获得流畅的显示/隐藏动画。您还应该将样式和js保存在单独的文件中，以便可以通过Rails资产管道进行编译。我认为稍后将在微博教程中介绍。

Rails 3：将用户信息放在当前页面的特定部分而不刷新的链接？

1 个答案: