Javascript 通过ajax调用呈现rails字段

我有一个AJAX调用：

$('#enrollment_members').change(function(){
var memberNumber = $(this);
$.ajax({type: 'GET',
      url: $(this).href,
      type: "get",
      data: { members: memberNumber.val() },
      error: function(){ alert("There was a problem, please try again.") }
      });
return false;

console.log(data);
});

通过它，我将params[：members]发送到一个新方法中

我想做这样的事情：

def new
  @enrollment = Enrollment.new
  params[:members] ? params[:members].to_i.times { @enrollment.atendees.build } : @enrollment.atendees.build

  respond_to do |format|
    format.js
  end
end

我需要这个值，以便知道要生成多少个

字段

但在新操作中，在
成员
输入字段中输入值后，如何更新新视图的内容

从这个三元组中，@enrollment.atendees包含4个对象

My
new.js.erb
：

$("#contact-wrap").html("<%= j render(:partial => 'enrollments/form') %>");

$（“#联系人包装”）.html（“‘注册/表格’）%>”；

xhr响应包含用于

表单的4个

字段。
对象

注册成员是您试图传递给控制器的输入值吗

如果是，请尝试以下方法：

$('#enrollment_members').change(function(){
  var memberNumber = $(this);
  $.ajax({type: 'GET',
    url: $(this).href,
    type: "get",
    data: { members: memberNumber.serialize() }, //CHANGE
    error: function(){ 
      alert("There was a problem, please try again.") 
    }
});
return false;

对象

#注册(u成员

是您试图传递给控制器的输入值吗

如果是，请尝试以下方法：

$('#enrollment_members').change(function(){
  var memberNumber = $(this);
  $.ajax({type: 'GET',
    url: $(this).href,
    type: "get",
    data: { members: memberNumber.serialize() }, //CHANGE
    error: function(){ 
      alert("There was a problem, please try again.") 
    }
});
return false;

---

嗯，你真的确定你需要一个定制的解决方案吗？在的

字段中动态添加/删除子项的行为已经被一些gem解决，例如（不再维护）或（更有希望）

我建议实际重用他们的库，即使你需要按自己的方式调整它。因为执行AJAX请求完全没有意义。您的AJAX是一个GET请求，它总是做同样的事情，除非您有一个自定义的
atendees.build
，它会为连续调用做一些奇怪的事情（比如在某个地方增加一个全局计数器）

我上面提到的这些gem实际上会将HTML字段保存在“模板”（以HTML或JS本地存储）中生成，并且当您想要添加新字段时，只需调用此模板。
Hmm您真的确定需要定制解决方案吗？在

的

字段中动态添加/删除子项的行为已经被一些gem解决，例如（不再维护）或（更有希望）

我建议实际重用他们的库，即使你需要按自己的方式调整它。因为执行AJAX请求完全没有意义。您的AJAX是一个GET请求，它总是做同样的事情，除非您有一个自定义的
atendees.build
，它会为连续调用做一些奇怪的事情（比如在某个地方增加一个全局计数器）

我上面提到的这些gem实际上会将要生成的HTML字段保存在一个“模板”（以HTML或JS本地存储）中，当您想添加一个新字段时，只需调用此模板。
我通过修改ajax调用使其正常工作：

$('#enrollment_members').change(function(){
var memberNumber = $(this);
$.ajax({type: 'GET',
      url: $(this).href,
      type: "get",
      dataType : "html",
      data: { members: memberNumber.val() },
        success: function( data ) {
          var result = $('<div />').append(data).find('#contact-wrap').html();
          $('#contact-wrap').html(result);
          $('#atendees-wrap').show();
        },
        error: function( xhr, status ) {
          alert( "Sorry, there was a problem!" );
        }
      });
return false;

});

$（“#注册#U成员”）.change（函数（）{
var memberNumber=$（此值）；
$.ajax（{type:'GET'，
url:$（this）.href，
键入：“获取”，
数据类型：“html”，
数据：{members:memberNumber.val（）}，
成功：功能（数据）{
var result=$（''）.append（data.find（'#contact wrap'）.html（）；
$（'#contact wrap'）.html（结果）；
$（“#atendees wrap”）.show（）；
},
错误：函数（xhr，状态）{
警报（“抱歉，出现问题！”）；
}
});
返回false；
});
我通过修改ajax调用使其正常工作：

$('#enrollment_members').change(function(){
var memberNumber = $(this);
$.ajax({type: 'GET',
      url: $(this).href,
      type: "get",
      dataType : "html",
      data: { members: memberNumber.val() },
        success: function( data ) {
          var result = $('<div />').append(data).find('#contact-wrap').html();
          $('#contact-wrap').html(result);
          $('#atendees-wrap').show();
        },
        error: function( xhr, status ) {
          alert( "Sorry, there was a problem!" );
        }
      });
return false;

});

$（“#注册#U成员”）.change（函数（）{
var memberNumber=$（此值）；
$.ajax（{type:'GET'，
url:$（this）.href，
键入：“获取”，
数据类型：“html”，
数据：{members:memberNumber.val（）}，
成功：功能（数据）{
var result=$（''）.append（data.find（'#contact wrap'）.html（）；
$（'#contact wrap'）.html（结果）；
$（“#atendees wrap”）.show（）；
},
错误：函数（xhr，状态）{
警报（“抱歉，出现问题！”）；
}
});
返回false；
});
这里应该做些什么还不清楚。。现在，只显示一个表单，我想在为members输入字段设置值后构建一个“members”数量的表单。就像用members参数重新呈现新页面一样。对不起，我编辑了我的答案以反映已更改的行。哦，我知道了。问题不在于它不发送参数。我对我的问题进行了编辑，使之更清楚一些。这里应该做些什么还不清楚。。现在，只显示一个表单，我想在为members输入字段设置值后构建一个“members”数量的表单。就像用members参数重新呈现新页面一样。对不起，我编辑了我的答案以反映已更改的行。哦，我知道了。问题不在于它不发送参数。我对我的问题进行了编辑，使之更加清晰。你的目标是什么还不清楚。你想通过AJAX调用动态地向HTML表单添加字段吗？@cyridd我编辑了我的问题，谢谢：）你的目标不是很清楚。你想通过AJAX调用将字段动态添加到HTML表单吗？@CyrilDD我编辑了我的问题，谢谢：）谢谢你的建议。但是你能给我一些关于如何解决问题中描述的问题的提示吗？也许我会在自定义更新或其他什么的时候碰到这个。基本上，我只需要用xhr响应重新呈现新视图。谢谢你的建议。但是你能给我一些关于如何解决问题中描述的问题的提示吗？也许我会在自定义更新或其他什么的时候碰到这个。基本上，我只需要用xhr响应重新呈现新视图。