プルダウンで選択したモデルのカラム値をフォームに挿入したい

前提

Ruby on rails で在庫を管理するシステムを作っています。

実現したいこと

「tire（タイヤ）」モデル
「increase（入庫入力）」モデル　belongs_to tire

入庫入力フォームで、tireモデルをプルダウンで選択すると、tireモデルのunit_priceカラムの値を、同じフォーム内の単価フォームに挿入したいです。

該当のソースコード

ruby
1tires_controller.rb
2
3  def get_unit_price
4    tire = current_user_company.tires.find(params[:tire_id])
5    @unit_price = tire.unit_price
6    respond_to do |format|
7      format.js
8    end
9  end
10

ruby
1increases_controller.rb
2
3  def new
4    @increase = current_user_company.increases.build
5  end

ruby
1routes.rb
2
3  resources :increases
4  resources :tires do
5    collection do
6      get :search
7      get :get_unit_price
8    end
9  end

ruby
1increases/_form.html.erb
2
3<%= form_with(model: increase, local: true, class: 'form-horizontal') do |form| %>
4  <%= render 'shared/error_messages', object: increase %>
5
6  <!-- タイヤ -->
7  <div class="form-group">
8    <div class="field">
9      <%= form.label "タイヤ", class: 'control-label col-sm-2' %>
10      <div class="col-sm-5">
11        <%= form.collection_select :tire_id, @tires.map, :id, :product_name, options = {:include_blank => true, selected: @increase[:tire_id]}, {class: 'form-control form-control-sm searchable', :onchange => "setUnitPrice($(this).val())"} %>
12      </div>
13    </div>
14  </div>
15  
16  <!-- 数量 -->
17  <div class="form-group">
18    <div class="field">
19      <%= form.label "数量", class: 'control-label col-sm-2' %>
20      <div class="col-sm-2">
21        <%= form.number_field  :quantity, id: :quantity, class: 'form-control form-control-sm' %>
22      </div>
23    </div>
24  </div>
25  
26  <!-- 単価 -->
27  <div><%= render 'increase_unit_price', form: form %></div>
28
29  <div class="form-group">
30    <div class="actions">
31     <%= form.submit class: 'btn btn-primary col-sm-1' %>
32    </div>
33  </div>
34<% end %>

ruby
1increases/_increase_unit_price.html.erb
2
3  <div class="form-group">
4    <div class="field">
5      <%= form.label "単価", class: 'control-label col-sm-2' %>
6      <div class="col-sm-2">
7        <%= form.number_field  :unit_price, id: :unit_price, class: 'form-control form-control-sm' %>
8      </div>
9    </div>
10  </div>

ruby
1tires/get_unit_price.html.erb
2
3$("#unit_price").html("<%= j(@unit_price.to_s) %>")

javascript
1set_unit_price.js
2
3function setUnitPrice(val){
4    var tire_id = val;
5    $.ajax({
6        url: "/tires/get_unit_price",
7        type: "GET",
8        data: {
9        tire_id: tire_id
10        }
11    })
12}

試したこと

参考にさせていただいたサイト

【Rails】Ajaxでプルダウンを選択したらフォームに自動挿入 1
こちらを参考にさせていただいたのですが、text_area に挿入されていまして、実装したnumber_fieldには反映されませんでした。

Rails初心者で、基本的なことなのかもしれませんが、ご教授お願いいたします。

winterboum

2022/08/05 13:20

text_area ってどこ？

kaniclub

2022/08/05 13:25

text_areaは参考にさせていただいたサイト様のソースです。

winterboum

2022/08/05 13:47

text_area に挿入されていまして、実装したnumber_fieldには反映されませんでした。とあるのは？

kaniclub

2022/08/05 15:00

実装したいのはfromヘルパーのnumber_fieldになります。参考サイト様はtext_areaなので、やり方が違うのかもしれないと思い、質問させていただきました。わかりにくい説明で申し訳ありません。

winterboum

2022/08/05 22:56

$("#unit_price").html("<%= j(@unit_price.to_s) %>") というのは #unit_price である form.number_field をそっくり（ Plane なテキスト）@unit_price.to_s に置き換えるということですから、やりたいこととは違いますね。でも、それも起きないとすると、、、、 log 確認してみてください。

kaniclub

2022/08/06 03:03

Rendering tires/get_unit_price.html.erb Rendered tires/get_unit_price.html.erb (0.9ms) Completed 200 OK in 21ms (Views: 8.1ms | ActiveRecord: 2.1ms) ログはエラーは出ずに処理されているようです。変化は、出力されるHTMLが <input id="unit_price" class="form-control form-control-sm" type="number" value="0" name="increase[unit_price]"> 上記の部分に、「1000</input>」が足された状態に変化いたします。　1000は選択したタイヤのunit_priceです。 <input id="unit_price" class="form-control form-control-sm" type="number" value="0" name="increase[unit_price]">1000</input>

winterboum

2022/08/06 11:24

ということは、できてるってことでは？

kaniclub

2022/08/06 12:12

フォーム事態には1000は表示も、出力もされない状態です。 text_areaに変更するとフォームに表示されます。ですが、表示させたいフォームはnumber_fieldになるので困っている状態です。素人考えかもしれませんが、valueの属性にデータを挿入できればと考えています。