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

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

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

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

Ruby on Rails

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

Slim

SlimはPHPアプリケーションを開発するための軽量なマイクロフレームワークです。

Q&A

0回答

370閲覧

railsアプリのcreateアクションで不足情報がある時、選択した画像が解除される

T.Adams

総合スコア40

Ruby

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

Ruby on Rails

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

Slim

SlimはPHPアプリケーションを開発するための軽量なマイクロフレームワークです。

0グッド

0クリップ

投稿2020/06/19 07:36

前提

Ruby on Railsを用いてアプリ作成を行っております。ユーザー作成フォームで画像を選択できるようにしているのですが、不足情報があった場合は、renderで再度画面を表示されるようにしています。

わからないこと

ユーザー作成フォームで、情報に誤りがある場合、作成時に選択していた画像が未選択になってしまいます。入力情報を間違えるたびに、画像を再選択するのは面倒なので、画像はそのままにしておきたいです。

詳細

Ruby

1class UsersController < ApplicationController 2 def new 3 @user = User.new 4 end 5 6 def create 7 @user = User.new(user_params) 8 if @user.save 9 log_in @user 10 flash[:success] = "ユーザーが作成できました" 11 redirect_to @user 12 else 13 render :new 14 end 15 end 16end

slim

1.row.justify-content-center 2 .panel.panel-default 3 .panel-heading 4 | 会員情報 5 .panel-body 6 form 7 = form_with model: @user, local: true do |f| 8 = f.label :image 9 .form-group 10 .imagePreview 11 .input-group 12 label.input-group-btn 13 #user_image 14 = f.file_field :image 15 .form-group 16 = f.label :name 17 = f.text_field :name, class: 'form-control', id: 'user_name' 18 - if @user.errors.include?(:name) 19 p style=("color: red;") = @user.errors.full_messages_for(:name).first 20途中省略 21 = f.submit "登録", class: 'btn btn-primary' 22 23javascript: 24 $(document).on('change', ':file', function() { 25 var input = $(this), 26 numFiles = input.get(0).files ? input.get(0).files.length : 1, 27 label = input.val().replace(/\/g, '/').replace(/.*//, ''); 28 input.parent().parent().next(':text').val(label); 29 30 var files = !!this.files ? this.files : []; 31 if (!files.length || !window.FileReader) return; 32 if (/^image/.test( files[0].type)){ 33 var reader = new FileReader(); 34 reader.readAsDataURL(files[0]); 35 reader.onloadend = function(){ 36 input.parent().parent().parent().prev('.imagePreview').css("background-image", "url("+this.result+")"); 37 } 38 } 39 });

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

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

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

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

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

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問