[英]jQuery, Rails, populating select box
我在填充选择框时遇到问题,具体取决于单击了具有给定category_id的哪个按钮。 当我单击其他按钮时,下拉列表中的数据正确,但格式错误。 它不是写为下拉列表,而是像数组“ [nam1,name2,....]”一样全部写在一行中,并且除了下拉列表之外,没有其他选项(如果在ajax成功函数中,我将data [i]代替数据,那么我会在一个巨大的选择中获得每个字母,因此效果不佳)。 多谢您的协助。
控制器:
def update_names
@categories = Category.all
@category = Category.find params[:category_id]
@labels = @category.category_labels.collect { |l| l.name }
respond_to do |format|
format.js { render json: @labels }
end
end
jQuery的:
$(function() {
$('.categories_btn').each(function(e){
$(this).on("click", function(e){
e.preventDefault();
e.stopImmediatePropagation();
var category_id = $(this).attr("category_id");
$.ajax('update_names', {
type: 'GET',
dataType: 'script',
cache: true,
data: {
category_id: category_id
},
error: function(jqXHR, textStatus, errorThrown) {
return console.log("AJAX Error: " + textStatus);
},
success: function(data, textStatus, jqXHR, json) {
$("select option").each(function(i, v) {
$('#labels_name').html( $('<option value="'+ i +'">'+data +'</option>'));
});
}
});
});
});
视图:
= f.select :name, @labels.collect { |l| [l.name, l.id] }, id: 'names_select'
您的代码中存在许多问题:
您只返回每个标签的name
,但也需要它们的id
参数。
您的dataType
设置为script
,但是您返回JSON。
您需要遍历所接收的数据,而不是遍历页面上已存在的options
。
因此,要解决:
1)将您的控制器代码更改为此:
def update_names
@categories = Category.all
@category = Category.find params[:category_id]
@labels = @category.category_labels.map do |l|
{ name: l.name, id: l.id }
end
respond_to do |format|
format.json { render json: @labels }
end
end
2)将您的请求中的dataType
更改为json
。
jQuery.ajax
文档说它将正确处理响应:
“ json”:将响应评估为JSON并返回一个JavaScript对象。
3)将您的success
处理程序更改为此:
success: function(data, textStatus, jqXHR, json) {
var parent_element = $("#names_select");
parent_element.html("");
data.forEach(function(v) {
var id = v.id;
var name = v.name;
parent_element.append('<option value="' + id '">' + name + '</option>');
};
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.