###コメント削除機能のAjaxが発火しません。
画像の投稿に対してのコメントの投稿、削除機能のAjax化に成功したので、
デプロイ後のファイルを編集して本番でも非同期で投稿、削除ができるようにするために、
ローカルの記述をそのままviの編集で書き加えました。
いざ動かしてみると、コメントの投稿は問題なく動きましたが、削除しようとするとAjaxが発火せず、
検証でconsoleを見てみると、
とエラーとなり、非同期通信が成功していませんでした。
この状態でcommand +Rでリロードすると削除され、エラーはなくなります。
ローカルの環境でも"rails s -e production"でサーバー起動できるように設定し、問題なく動いたので、これで本番環境に移行したときにエラーになってしまう理由がわからないでいます。
500(Internal Server Error)について少し調べて見たところ、500番台のエラーはサーバー側のエラーのようです。原因としては、
・サーバー側の高負荷
・文法エラー等
他にもいくつか考えられる原因は列挙されていましたが、おそらく自分の文法エラーなのかなと思うのですが。。。
[9/27追記]
いただいたアドバイスを元に、サーバー側のエラーが起きているときのログを確認してみると
(※@photoの@は部分テンプレートでrenderしようしているため今@photoはphotoに修正してあります)
テンプレートエラーが発生している事がわかりました。
発生している問題・エラーメッセージ
500 (Internal Server Error)
該当のソースコード
javascript
1// コメント投稿Ajax(#ajaxが投稿フォームのid、 .delete-commentが削除のlink_toに指定したclassです) 2 $(document).on("ajax:success", "#ajax, .delete-comment", function(e) { 3 $('#ajax-comments').html(e.detail[2]["response"]); 4 $(".comment-form").val(''); 5 });
試したこと
□投稿と削除のjsの記述を分けてみました
$(document).on("ajax:success", "#ajax", function(e) {
$('#ajax-comments').html(e.detail[2]["response"]);
$(".comment-form").val('');
});
と
$(document).on("ajax:success", ".delete-comment", function(e) {
$('#ajax-comments').html(e.detail[2]["response"]);
$(".comment-form").val('');
});
で、2つに分けてみました。結果同じ削除で500エラーでした。
□application.jsに記述してあったものを、該当するviewファイルの<script>タグ内に記述してみました
<script> $(document).on("ajax:success", "#ajax, .delete-comment", function(e) { $('#ajax-comments').html(e.detail[2]["response"]); $(".comment-form").val(''); }); </script>結果、やはり同じ削除で500エラーでした。
以下、関連しうる現状のコードです
[routes.rb]
resources :photos do resource :likes, only: [:create, :destroy] resources :post_comments, only: [:create, :destroy] end ``` [post_comments_controller.rb] ```ここに言語を入力 def destroy @photo = Photo.find(params[:photo_id]) @user = @photo.user @comment = PostComment.find(params[:id]) @comment.destroy render partial: 'photos/comments', locals: { photo: @photo, user: @user } end ``` [/photos/_comments.html.erb] ```ここに言語を入力 <% photo.post_comments.reverse.each do |pstcmt| %> <!--中略--> <% if pstcmt.user == current_user %> <%= link_to photo_post_comment_path(pstcmt.photo.id, pstcmt.id), class: "delete-comment", method: :delete, remote: true do%> <div style="margin-left:10px; color:rgba(0, 0, 0, 0.4);"> <i class="far fa-trash-alt"></i>削除 </div> <% end %> <% end %> <!--中略--> <% end %> ``` もし判明しましたらご教示よろしくお願いいたします。
回答1件
あなたの回答
tips
プレビュー