質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Ruby on Rails 4

Ruby on Rails4はRubyによって書かれたオープンソースのウェブフレームワークです。 Ruby on Railsは「設定より規約」の原則に従っており、効率的に作業を行うために再開発を行う必要をなくしてくれます。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Q&A

解決済

1回答

2721閲覧

Ajaxを使用してview側でも部分更新を反映させたい

NaojirouHisada

総合スコア60

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Ruby on Rails 4

Ruby on Rails4はRubyによって書かれたオープンソースのウェブフレームワークです。 Ruby on Railsは「設定より規約」の原則に従っており、効率的に作業を行うために再開発を行う必要をなくしてくれます。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

0グッド

0クリップ

投稿2016/04/19 15:36

編集2016/04/20 15:42

###実装したい機能
Ajaxを利用したコメントの登録および部分更新による表示

###問題点

http://qiita.com/Yama-to/items/377f8a92cf30a3ebf454
上記記事のコメント機能を模倣してみたり、
RailsGuideを調べてました。
しかし、
Ajaxを利用して、サーバー側では、新しいコメントは登録されているのですが、
肝心なview側で部分更新がされません。

###解決したい点
どのように記述すれば、
部分更新がview側でも反映されるのでしょうか??

お手数おかけしますが、
アドバイス宜しくお願いします。

###ソースコード

show.html.erb <%= @user.first_kanji%> <%= link_to '基本情報編集' ,edit_user_path(@user) %> <%= render 'follow_form' if logged_in? %> <% if @user.microposts.any? %> <%= render partial: 'microposts/micropost', locals:{microposts: @microposts} %> <% end %>
_micropost.html.erb <% microposts.each do |micropost| %> <div id="micropost<%=micropost.id %>"> <% @micropost = micropost %> <p><%= micropost.user.first_kanji %> <%= micropost.user.last_kanji %>さん<br /> <%= micropost.content %> <% if current_user.following?(@user) && @following_relationships.status == 1 || current_user.follower?(@user) && @follower_relationships.status == 1 %> <%= render partial:'shared/comment_form' %> <% end %> <div id="comments<%=micropost.id %>"> <%= render partial: 'comments/comment' ,locals:{comments: @micropost.comments} %> </div> <%- if current_user == micropost.user %> <%= link_to "削除", micropost , method: :delete , data:{confirm: "削除してよろしいですか?"} %> <% end %> </div> <% end %>
_comment.html.erb <% comments.each do |comment| %> <div id="comment<%=comment.id %>"> <p><%= comment.content %></p> </div> <% end %>
_comment_form.html.erb <%= form_for(@comments,remote: true) do |f| %> <%= f.text_field :content , id: "comment_field" %> <%= hidden_field_tag :micropost_id , @micropost.id %> <%= hidden_field_tag :user_id , current_user.id %> <%= f.submit '投稿' %> <% end %>
CommentController class CommentsController < ApplicationController before_action :logged_in_user def create @user = User.find(params[:user_id]) @micropost = Micropost.find(params[:micropost_id]) @comment = current_user.comments.build(comment_params) @comment.micropost = @micropost respond_to do |format| if @comment.save @succeed = true format.html{redirect_to @user , notice: "Create Comment"} format.js {} format.json { render json: 'comments/comment', status: :created, location: @micropost.comments } else flash[:danger] = 'missing' end end end private def comment_params params.require(:comment).permit(:content) end end
create.js.erb <% if @succeed %> $("#comment_field").val(''); $(" $("#comments<%=@micropost.id %>" %>).innerHTML("<%= escape_javascript(render partial: 'comments/comment' , locals:{comments: @micropost.comments} )%> ); <% else %> <% end %>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

自己解決

スペルミスによるもので、
そこをデバックしたらうまく実装できました!
この質問を見て考えてくれた方々には本当に感謝してます!
ありがとうございました(^^)

投稿2016/04/23 17:14

NaojirouHisada

総合スコア60

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2016/04/23 17:30

解決できたようでよかったですね。まだ質問が「受付中」になっていますが、いったん「解決済」にされてはいかがでしょうか。
NaojirouHisada

2016/04/23 17:32

ずっと悩んでたタネが解決できて本当によかったです!! 忘れてました(^^;) ご指摘ありがとうございます(^^) 以後気をつけます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問