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

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

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

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

Ruby on Rails

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

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Ajax

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

Q&A

0回答

1663閲覧

railsで選択した日付に紐づくデータを非同期で取得し、create と update を切り分けたい

mikannOishiii

総合スコア6

Ruby

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

Ruby on Rails

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

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Ajax

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

0グッド

1クリップ

投稿2020/03/25 06:53

編集2020/03/25 09:53

rails初心者ですが、ポートフォリオとして血圧管理アプリを作ろうとしています。
form_for の仕組みを利用して、新規と更新をうまく切り分けてできるかな?と思いましたが、うまくできずに困っています。
どなたかお知恵を貸していただけると嬉しいです。

前提・実現したいこと

・入力フォーム(form_for)において、date_field で日付選択
・日付に紐づくデータがある場合は、各fieldに内容が表示され、更新できる
・日付に紐づくデータがない場合は、フォームに入力した内容で新規作成

画面イメージはこちらです。
入力フォーム
※日付を変更すると、その日付ひ紐づくデータがある場合は、最高血圧、最低血圧、脈拍などの入力フォームにデータが反映されるといったイメージ

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

・新規作成はできるが、更新ができない
・紐づくデータを非同期(Ajax)で取得することはできたが、更新ができない

該当のソースコード

※ 試行錯誤の跡があり、controllerでやたらと条件分岐が入っちゃってます。

ruby

1# config/routes.rb 2 3resources :records, only: [:new, :create, :update, :destroy] do 4 collection do 5 get 'search' 6 end 7 end

ruby

1# app/controllers/records_controller.rb 2 3class RecordsController < ApplicationController 4 before_action :authenticate_user! 5 6 def new 7 @user = current_user 8 default_day = Time.now //デフォルトで今日の日付 9 @record = @user.records.find_by(date: default_day) 10 if @record.new_record? 11 @record = Record.new(date: default_day) 12 else 13 @record = @user.records.find_by(date: default_day) 14 end 15 end 16 17 def create 18 @record = Record.new(record_params) 19 if @record.save 20 redirect_to root_url 21 flash[:notice] = 'Record was successfully created.' 22 else 23 flash.now[:danger] = 'errored!' 24 render 'new' 25 end 26 end 27 28 def update 29 @record = @user.records.find_by(date: params[:record][:date]) 30 if @record.update_attributes(record_params) 31 redirect_to root_url 32 flash[:notice] = 'Record was successfully updated.' 33 else 34 flash.now[:danger] = 'errored!' 35 render 'new' 36 end 37 end 38 39 def search 40 @user = current_user 41 @record = @user.records.where("date = ?", params[:date]) 42 if @record.new_record? 43 @record = Record.new 44 render json: @record 45 else 46 render json: @record 47 end 48 end 49 50 private 51 52 def record_params 53 params.require(:record).permit(:date, :m_sbp, :m_dbp, :m_pulse, 54 :n_sbp, :n_dbp, :n_pulse, :memo,) 55 .merge(user_id: current_user.id) 56 end

html

1<%= form_for @record do |f| %> 2 <% if @record.errors.any? %> 3 <div class="alert alert-warning"> 4 <ul> 5 <% @record.errors.full_messages.each do |message| %> 6 <li><%= message %></li> 7 <% end %> 8 </ul> 9 </div> 10 <% end %> 11 <div class="form-group"> 12 <%= f.label :date, for: "inputDate" %> 13 <%= f.date_field :date, class: "form-control", id: "inputDate", value: @record.date %> 14 </div> 15 <p class="rcd-lbl">朝:</p> 16 <div class="form-row"> 17 <div class="form-group col-md-4"> 18 <%= f.label :m_sbp, for: "inputM_SBP", class: "sr-only" %> 19 <%= f.telephone_field :m_sbp, placeholder: "最高血圧", class: "form-control", id: "inputM_SBP", value: @record.m_sbp %> 20 </div> 21 <div class="form-group col-md-4"> 22 <%= f.label :m_dbp, for: "inputM_DBP", class: "sr-only" %> 23 <%= f.telephone_field :m_dbp, placeholder: "最低血圧", class: "form-control", id: "inputM_DBP", value: @record.m_dbp %> 24 </div> 25 <div class="form-group col-md-4"> 26 <%= f.label :m_pulse, for: "inputM_PLS", class: "sr-only" %> 27 <%= f.telephone_field :m_pulse, placeholder: "脈拍", class: "form-control", id: "inputM_PLS", value: @record.m_pulse %> 28 </div> 29 </div> 30 <p class="rcd-lbl">夜:</p> 31 <div class="form-row"> 32 <div class="form-group col-md-4"> 33 <%= f.label :n_sbp, for: "inputN_SBP", class: "sr-only" %> 34 <%= f.telephone_field :n_sbp, placeholder: "最高血圧", class: "form-control", id: "inputN_SBP", value: @record.n_sbp %> 35 </div> 36 <div class="form-group col-md-4"> 37 <%= f.label :n_dbp, for: "inputN_DBP", class: "sr-only" %> 38 <%= f.telephone_field :n_dbp, placeholder: "最低血圧", class: "form-control", id: "inputN_DBP", value: @record.n_dbp %> 39 </div> 40 <div class="form-group col-md-4"> 41 <%= f.label :n_pulse, for: "inputN_PLS", class: "sr-only" %> 42 <%= f.telephone_field :n_pulse, placeholder: "脈拍", class: "form-control", id: "inputN_PLS", value: @record.n_pulse %> 43 </div> 44 </div> 45 <div class="form-group"> 46 <%= f.label :memo, for: "inputMemo" %> 47 <%= f.text_area :memo, placeholder: "体の調子など", class: "form-control", id: "inputMemo", rows: "2", value: @record.memo %> 48 </div> 49 <div class="form-group"> 50 <%= f.submit "記録する", class: "btn btn-block btn-blue" %> 51 </div> 52<% end %>

また、こちらの記事を参考にして、日付を検索してそれに紐づいた情報を取得するということはできました。(これにより情報は更新されますが、更新はできず全部新規作成になってしまいます。)
https://qiita.com/yuki-n/items/fdc5f7d5ac2f128221d1

jquery

1$(document).on('change', '#inputDate','turbolinks:load', function(){ 2 var inputDate = $("#inputDate").val(); 3$.ajax({ //ajax通信 4 url: '/records/search', //urlを指定 5 type: 'GET', 6 data: ('date=' + inputDate), 7 processData: false, 8 contentType: false, 9 dataType: 'json' //データ形式を指定 10 }) 11 .done(function(data){ //データ受取成功の場合 12 $("#inputM_SBP").val(data[0].m_sbp); 13 $("#inputM_DBP").val(data[0].m_dbp); 14 $("#inputM_PLS").val(data[0].m_pulse); 15 $("#inputN_SBP").val(data[0].n_sbp); 16 $("#inputN_DBP").val(data[0].n_dbp); 17 $("#inputN_PLS").val(data[0].n_pulse); 18 $("#inputMemo").val(data[0].memo); 19 }) 20 .fail(function(data){ //データ受取失敗の場合 21 $("#inputM_SBP").val(""); 22 $("#inputM_DBP").val(""); 23 $("#inputM_PLS").val(""); 24 $("#inputN_SBP").val(""); 25 $("#inputN_DBP").val(""); 26 $("#inputN_PLS").val(""); 27 $("#inputMemo").val(""); 28 }) 29});

試したこと

・find_or_initialize_by の検討(結局うまく活用できず)
・その他参考になりそうな記事を探しましたが、見つけられず。。。

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

・ruby 2.6.5
・rails 6.0.2

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

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

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

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

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

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

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

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

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

ただいまの回答率
85.46%

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

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

質問する

関連した質問