0

だから私はRoRアプリに取り組んでおり、何かを助けていただければ幸いです. このアプリには、ユーザーによって投稿された一連のディスカッションがあり、以下のコメントもユーザーによって投稿されています。デザイン的には、各ディスカッションが画面全体に表示され、その右側にボタンが配置されているとかっこいいと思いました。このボタンを押すと、ビューが移動し、別のディスカッションが表示されます。これを行う方法について何か提案はありますか? 私が現在持っている議論の一部をheres。ありがとう!

<link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,300' rel='stylesheet' type='text/css'>


<% content_for :script do %>
    <%= javascript_include_tag 'hover_content' %>
    <% end %>

<% @micropost = Micropost.new %>
<% @micropost.discussion_id = discussion.id %>

<li>
  <div class = "intro-bar"><span class = "intro"><%=discussion.intro %></span></div>
  <div class = "content-bar">
    <span class = "content"><%= discussion.content %></span>
  </div>
  <input type='button' id='hideshow' value='hide/show'>
</li>

<span class = "timestamp">
    Posted <%= time_ago_in_words(discussion.created_at) %> ago.
  </span>

            <% if signed_in? %>
                <div class = "row">
                  <aside class = "span4">
                    <section>
                      <%= form_for(@micropost) do |f| %>
                          <%= render 'shared/error_messages', object: f.object %>
                          <div class="field">
                            <%= f.text_area :content, placeholder: "Post a comment" %>
                          </div>
                          <%= f.hidden_field :discussion_id%>

                          <%= f.submit "Break Up", class: "btn btn-large btn-breakup",:name => "break_up" %>
                          <%= f.submit "Stay Together", class: "btn btn-large btn-staytogether", :name => "stay_together" %>
                              <% end %>
                              </section>
                              </aside>
                              </div>
                          <% end %>

<div class = "comments">
  <% discussion.microposts.each do |micropost| %>
      <div class = 'comment-box'>
      <li>
        <div class = "comment-pic"></div>
        <div class = "post-comment"><%= micropost.content%></div>
      </li>
      </div>
  <% end %>
</div>
4

1 に答える 1