Rails ダイナミックセレクト
解決済
回答 1
投稿 ・編集
- 評価
- クリップ 0
- VIEW 1,247
ajax通信で子カテゴリを変えたいのですが、うまくいきません
お助けください
お助けください
def list
selected_category = Category.where(parent_id: list_params)
childs = selected_category.childs.sort{|a, b| a.code <=> b.code}
data = []
childs.each do |child|
data << {id: child.id, name: child.name}#child.code
end
respond_to do |format|
format.json { render json: data }
end
end
def list_params
params.require(:category_id)
end
$(document).on('change', '#category_select', function(evt) {
$.ajax({
type: 'GET',
url: 'categoreis/list',
dataType: 'json',
data: {
parent_id: $("#category_select option:selected").val()
},
error: function(jqXHR, textStatus, errorThrown) {
console.log("AJAX Error: " + textStatus);
},
success: function(data, textStatus, jqXHR) {
$("#child_select").empty();
if (data.length == 0) {
$("#child_select").hide();
} else {
$("#child_select").show();
}
$.each(data, function(idx, item) {
// console.log("" + item.code + ":" + item.name);
$("#child_select").append('<option value="' + item.code + '">' + item.name + '</option>');
});
console.log("Dynamic country select OK!");
}
});
});
<div class="form-group">
<label for="categoryqid" class="col-sm-3 control-label">カテゴリ</label>
<div class="col-sm-9">
<%= f.select :code, options_for_select(@categories.collect { |category|
[category.name, category.id] }), {:prompt => '選択してください' },
{ id: 'category_select', class: 'form-control select select-primary select-block mbl' } %>
<%= f.select :category_id, options_for_select(@childs.collect { |child|
[child.name, child.id] }), {:prompt => '選択してください' },
{ id: 'child_select' , class: 'form-control select select-primary select-block mbl'} %>
</div>
</div>
-
気になる質問をクリップする
クリップした質問は、後からいつでもマイページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
クリップを取り消します
-
良い質問の評価を上げる
以下のような質問は評価を上げましょう
- 質問内容が明確
- 自分も答えを知りたい
- 質問者以外のユーザにも役立つ
評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。
質問の評価を上げたことを取り消します
-
評価を下げられる数の上限に達しました
評価を下げることができません
- 1日5回まで評価を下げられます
- 1日に1ユーザに対して2回まで評価を下げられます
質問の評価を下げる
teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。
- プログラミングに関係のない質問
- やってほしいことだけを記載した丸投げの質問
- 問題・課題が含まれていない質問
- 意図的に内容が抹消された質問
- 過去に投稿した質問と同じ内容の質問
- 広告と受け取られるような投稿
評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。
質問の評価を下げたことを取り消します
この機能は開放されていません
評価を下げる条件を満たしてません
質問の評価を下げる機能の利用条件
この機能を利用するためには、以下の事項を行う必要があります。
- 質問回答など一定の行動
-
メールアドレスの認証
メールアドレスの認証
-
質問評価に関するヘルプページの閲覧
質問評価に関するヘルプページの閲覧
check解決した方法
0
<div class="form-group">
<label for="category_id" class="col-sm-3 control-label">カテゴリ</label>
<div class="col-sm-9">
<%= f.select :category_id, options_for_select(@categories.collect { |category|
[category.name, category.id] }), {:prompt => '選択してください' },
{ id: 'category_select', class: 'form-control select select-primary select-block mbl' } %>
<br>
<%= f.select :category_id, options_for_select(@childs.collect { |child|
[child.name, child.id] }), {:prompt => '選択してください' },
{ id: 'child_select' , class: 'form-control select select-primary select-block mbl'} %>
</div>
</div>
def list
selected_category = Category.where(parent_id: list_params)
data = []
selected_category.each do |child|
data << {id: child.id, name: child.name}#child.code
end
respond_to do |format|
format.json { render json: data }
end
end
def list_params
params.require(:category_id)
end
$(document).on('change', '#category_select', function(evt) {
$.ajax({
type: 'GET',
url: 'categoreis/list',
dataType: 'json',
data: {
category_id: $("#category_select option:selected").val()
},
error: function(jqXHR, textStatus, errorThrown) {
console.log("AJAX Error: " + textStatus);
},
success: function(data, textStatus, jqXHR) {
$("#child_select").empty();
if (data.length == 0) {
$("#child_select").hide();
} else {
$("#child_select").show();
}
$.each(data, function(idx, item) {
// console.log("" + item.code + ":" + item.name);
$("#child_select").append('<option value="' + item.code + '">' + item.name + '</option>');
});
console.log("Dynamic country select OK!");
}
});
});
投稿
-
回答の評価を上げる
以下のような回答は評価を上げましょう
- 正しい回答
- わかりやすい回答
- ためになる回答
評価が高い回答ほどページの上位に表示されます。
-
回答の評価を下げる
下記のような回答は推奨されていません。
- 間違っている回答
- 質問の回答になっていない投稿
- スパムや攻撃的な表現を用いた投稿
評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。
15分調べてもわからないことは、teratailで質問しよう!
- ただいまの回答率 88.19%
- 質問をまとめることで、思考を整理して素早く解決
- テンプレート機能で、簡単に質問をまとめられる