一个 f.select 在同一个表单中影响另一个？（不需要）答案

【问题标题】：one f.select is affecting another within the same form? (unwanted)一个 f.select 在同一个表单中影响另一个？（不需要）
【发布时间】：2016-05-09 20:38:01
【问题描述】：

我有一个问题，当添加一个新的 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 调用无法完成，因为它正在尝试使用 @ 查找客户987654326@ 等于在另一个选择框中选择的日期的年份！！

这是一个例子。我在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()
            }
        }
    )

}

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

【问题讨论】：

标签： javascript html ruby-on-rails ruby ajax

【解决方案1】：

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

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

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

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

【讨论】：