一个f.select正在影响同一形式的另一个？ （不必要的）

Question

我有一个问题，在添加新的html元素时，例如：

<%= f.date_select :date, { id: "date-select"} %>

它影响我现有的集合选择：

<%= f.collection_select :id,
                          Customer.where(business_id: current_customer.business_id),
                          :id,
                          :full_name,
                          { prompt: 'Select' },
                          { id: "colleague-select", onChange: "renderColCal(this)" } %>

通常，客户可以从列表中选择另一个客户，触发ajax调用以使用所选客户的id呈现所选客户的日历。这本身很好。

但是，当我在表单中进一步添加新的date_select选项，然后尝试使用collection_select时，无法完成ajax调用，因为它正在尝试查找id等于在另一个选择框中选择的日期年份的客户!!

这是一个例子。我在date_select选择了年份为“2012”的日期。然后我在collection_select中选择一个客户，并在控制台中收到：

Started GET "/calendars/calendar_change?colleagueID=2012" for 127.0.0.1 at 2016-02-01 11:38:01 +0000
Processing by CalendarsController#calendar_change as */*
  Parameters: {"colleagueID"=>"2012"}
  Customer Load (0.0ms)  SELECT  "customers".* FROM "customers"  WHERE "customers"."id" = ?  ORDER BY last_name ASC LIMIT 1  [["id", 2012]]
Completed 404 Not Found in 5ms

ActiveRecord::RecordNotFound (Couldn't find Customer with 'id'=2012):
  app/controllers/calendars_controller.rb:19:in `calendar_change'

这是我的javascript：

function renderColCal(select){

    var colleagueID = select.value ;
    $.ajax({
            url: '/calendars/calendar_change',
            data:{
                colleagueID: $('select').val()
            }
        }
    )

}

为什么会这样？我该如何解决？谢谢！

Answer 1

问题是你的javascript。您提交的数据是

data:{
   colleagueID: $('select').val()
}

提交页面上第一个选择的值。如果你想走这条路线，你必须使你传递给$（）的选择器更具选择性（例如，使用选择框的id）。

您实际上是从事件处理程序前面的选择框中检索值，但由于某种原因您没有使用它。这可能比使用jquery在已经传递给你的时候找到select元素更不容易出错。