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

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

ただいまの
回答率

90.51%

  • Ruby

    9405questions

    Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

  • Ruby on Rails

    8826questions

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

  • POST

    271questions

    POSTはHTTPプロトコルのリクエストメソッドです。ファイルをアップロードしたときや入力フォームが送信されたときなど、クライアントがデータをサーバに送る際に利用されます。

  • Model

    93questions

    MVCモデルの一部であるModelはアプリケーションで扱うデータとその動作を管理するために扱います。

Rails Users/edit.html.erbのモーダル上で別モデルのPOSTができない件。

解決済

回答 1

投稿

  • 評価
  • クリップ 0
  • VIEW 106

Romay

score 15

前提・実現したいこと

Railsでアプリ作成中です。

User/edit.html.erbのユーザー編集画面で、別モデルであるImagesのPOSTがモーダル上でできないことがわかりました。
UserモデルのPOSTは、モーダル上ででき、ImagesモデルのPOSTがモーダルでなければできることから、なにかしらRailsの機能としてモーダル上では別モデルの POSTができないようになっているのではないかと推測しています。

具体的にどこが原因なのか、Railsのどの仕様なのか教えていただけると嬉しいです。

  1. users/edit.html.erbのモーダル上でImagesモデルのフォームを送信
  2. image_controllerのcreateアクションへ
  3. DBに保存されリダイレクトされ元の画面へ。

上記の流れの中で、1のフォーム送信ボタンを押下後、image_controllerを通らずにusers/edit.html.erbに戻ってきてしまいます。

Imageモデルは、image_uploaderをmountしています。

発生している問題・エラーメッセージ

フォーム送信後、

localhost:3000/*****/edit?utf8=✓&authenticity_token=S08quUa**************************D&action=edit&route=users&idParams=3&image%5Bimage%5D=&commit=変更

のようなURLが発行されedit画面に戻ってきています。

該当のソースコード

users/edit.html.erb

<!-- 背景画像のモーダル開く部分 -->
 <label class="cover-image img-responsive center-block open" data-toggle="modal" data-target="#coverimageModal" >
   <% if @user.image %>
      <%= image_tag(@user.image , :class => "user-cover-image") %>
   <% else %>
       <%= image_tag "default.jpg" , :class => "user-cover-image" %>
   <% end %>
       <i class="fa fa-camera fa-2x image-icon"></i>
</label>

<!-- 省略 -->

<!-- 背景画像のモーダル -->
 <div class="modal" id="coverimageModal" tabindex="-1" role="dialog" aria-labelledby="modal" aria-hidden="true">
    <div class="cover_overlay"></div>
     <div class="modal-inner">
      <div class="inner">
      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
       <span aria-hidden="true">&times;</span>
      </button>
      <form class="form-wrapper">
       <div class="contents-inner">
       <div class="contents-link">
        <div class="copy_result">
       <p class="copy-after-result" style="display: block;">
         カバー写真を編集する
         </p>

<!-- 以下フォーム内容 -->
<%= form_for(@image, :url => {:controller => :images, :action => :create}, html: { multipart: true }) do |f| %>
<!-- ajax処理で使う分のパラメータをhidden_fieldで持っておく -->
   <%= hidden_field_tag "action", params[:action] %>
   <%= hidden_field_tag "route", "users" %>
   <%= hidden_field_tag "idParams", @user.id %>

   <label class="copy-after-btn cover-btn-edit">
     <%= f.file_field :image , accept: 'image/*', :style=>"display:none;", id: 'image_img', class: "icon"  %>

     <p>写真を選択</p>
  </label>
  <div class="cover-image-preview">
   <div id="img_field" onClick="$('#image_img').click()" >
    <img id="image_img_prev" src="#" class='hidden cover-image-preview-inner' />
     <%= image_tag(@image.image ,:class => "cover-image-preview-inner image_present_img")%>
   </div>
  </div>
</div>
  <%= f.submit "変更", class: "btn submit_btn" %>
<% end %>

<!-- 省略 -->

試したこと

Users/edit/html/erbのフォームを限りなくシンプルにしたり、form_tagに変えてみたりしましたがどれも全く同じ挙動になりました。そのため、画像送信やフォームが原因ではなく、モーダル上であることが原因だと推測しています。

補足情報(FW/ツールのバージョンなど)

ルーティングもコントローラーも設定しています。

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

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

0

<%= form_for(@image, :url => {:controller => :images, :action => :create}, html: { multipart: true }) do |f| %>

この箇所は出力されるhtmlではどのようになっていますでしょうか?
ヒントになるのではないかと思います。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/03/23 03:33

    コメント遅れまして申し訳ありません。モーダルでの実装をやめ、違う方法で実装いたしました。
    今回はこれにて質問を閉じさせていただきます。コメントありがとうございました。

    キャンセル

同じタグがついた質問を見る

  • Ruby

    9405questions

    Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

  • Ruby on Rails

    8826questions

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

  • POST

    271questions

    POSTはHTTPプロトコルのリクエストメソッドです。ファイルをアップロードしたときや入力フォームが送信されたときなど、クライアントがデータをサーバに送る際に利用されます。

  • Model

    93questions

    MVCモデルの一部であるModelはアプリケーションで扱うデータとその動作を管理するために扱います。