Railsでアプリの作成中です。
都道府県のドロップダウンメニューで選択て入力出来る状態にあります。
保存も出来ていますので動作自体は問題はないのですが、jQueryの読み込みがおかしいようなのです。
現象は以下のようになっています。
1,$ rails s -b 0.0.0.0 でサーバー起動 2, http://example.com:3000 でブラウザーからアクセス。 3, 住所入力フォームの表示 4, 都道府県のドロップダウンメニューで選択 5,市区町村のドロップダウンメニューの選択がなにも反応せず。 6,ブラウザをリロード 7,再度、都道府県のドロップダウンメニューで選択 8,すると市区町村のドロップダウンメニューい選択可能な状態になる 9,データの保存 OK
と、このように「毎回住所入力フォームを新たに開くたびにリロードしないと、都道府県のドロップダウンメニューと市区町村のドロップダウンメニューが連動してくれない」という状態です。
リロードをすると、正常に連動できて、テーブルに保存も出来ているので、コードには問題はないと思うのですが、なにが原因かもわからないのです。
ページをリロードしないとフォームの連動だけが出来ない状態なのでjQueryの読み込みの新規登録、編集画面に変わる際にjQueryにファイルが読み込めていないのが原因なのかもしれませんが、どう対応していいかわからないのでどなたかご教授お願いいたします。
コードの追記
app/view/client/new.html.erb <% @title = '代行業者の新規登録' %> <h1><%= @title %></h1> <div id="generic-form"> <%= form_for @account, url: :client_user do |f| %> <%= render 'form', f: f %> <div class="buttons"> <%= f.submit '登録' %> <%= link_to 'キャンセル', :client_root %> </div> <% end %> </div>
app/assets/javascripts/client/user.js $(function() { var $children = $('.children'); var original = $children.html(); $('.parent').change(function() { var val1 = $(this).val(); $children.html(original).find('option').each(function() { var val2 = $(this).data('val'); if (val1 != val2) { $(this).not('optgroup,.msg').remove(); } }); if ($(this).val() === '') { $children.attr('disabled', 'disabled'); } else { $children.removeAttr('disabled'); } }); });
_form.html.erb <%= f.label :prefecture, '1、事業所住所(都道府県)', class: 'required' %> <select class="parent" name="client[prefecture]" required> <option value="" class="msg" disabled selected>-----①都道府県を選択-----</option> <option value="北海道"> 北海道</option> <option value="青森県">青森県</option> <option value="岩手県">岩手県</option> <option value="宮城県">宮城県</option> <option value="秋田県">秋田県</option> </select> <%= f.label :city, '2、事業所住所(市区町村)', class: 'required' %> <select class="children" name="client[city]" disabled required> <option value="" class="msg" disabled selected>-----②市区町村を選択-----</option> <!--北海道--> <option value="札幌市中央区" data-val="北海道">札幌市中央区</option> <option value="札幌市北区" data-val="北海道">札幌市北区</option> <option value="札幌市東区" data-val="北海道">札幌市東区</option> <option value="札幌市白石区" data-val="北海道">札幌市白石区</option> <option value="札幌市豊平区" data-val="北海道">札幌市豊平区</option> </select>
app/assets/javascripts/client.js //= require jquery //= require rails-ujs //= require jquery.turbolinks //= require jquery-ui //= require turbolinks //= require jquery-ui/widgets/datepicker //= require jquery-ui/i18n/datepicker-ja //= require_tree ./shared //= require_tree ./client
都道府県、市区町村は一部のみ記載しました。
追記2
連動出来ていない状態のソースコード
ソースコードを表示したところ、読み込んでいるようなのですが・・・ <script src="/assets/client/user.self-a5d0dff0afa719930cd12dc00528dfe5b7b3ea3cc2bb7df9e504b0e558a83f30.js?body=1" data-turbolinks-track="true"></script>
暗号みたいになっていますが、多分assets/cilent/user.selfとあるので読み込み出来ているのでしょうか?
ちなみに、ページをリロードしてもソースコードの表示に変化はなく同じソースコードが表示されています。
回答1件
あなたの回答
tips
プレビュー