使用 Javascript 在 hidden_field_tag 中保存一个值

Question

我在 rails 应用程序中有一个表单，其中包含一个用于选择城市并保存其 ID 的字段。

= select_tag 'building[city_id]', 
options_for_select(cities.map{|c| [c.name, c.id]}),
onchange: "myFunction();", include_blank: "Choose city"

我想在用户从 select 标签中选择内容后立即将城市名称保存在 hidden_field_tag 中。如何使用 Javascript?

实现此功能

我对Javascript很陌生，请不要硬判断。

Answer 1

我建议尽量少做JS。所以：

首先在您的 Rails 视图中添加隐藏字段（具有空值）。

现在您需要将 Javascript 添加到您的页面（您可能已经在 app/assets/javascripts/application.js 处有一个文件，它包含在您的所有页面中；包括 JS 与您的 Rails模板是它自己的问题）。您将需要两个函数，jQuery 会让生活变得更轻松：

一个函数，它检查 select 标签的值，并用 select 标签的值更新隐藏标签的值。
一个在页面加载时运行的函数，它将事件侦听器附加到 select 标记；这将监听 "select" 标签上的 "change" 事件，并在它看到它时调用我们的第一个函数。

这些看起来有些东西是这样的（N.B。这段代码几乎肯定不会不做任何更改就为你工作） :

function setHiddenValue() {
  // Get the value from the select tag
  var selectValue = $('select#building_city_id').val();
  // Set the hidden tag's value to the select tag value we got in the last line
  $('input[type=hidden]#city_name').val(selectValue);
}

我猜是在 selector 获取元素，但 Rails 正在为它们添加 ID 以供您使用。

$(document).ready(function () {
  $('select#building_city_id').on('change', setHiddenValue());
}

显然这是粗略的，不会在粘贴后立即起作用。您需要确保 select 或匹配 Rails正在放入您的 HTML，您需要确保脚本包含在您的页面中并且正在设置事件侦听器，您需要检查 jQuery 是否存在，并且您'将要确保 setHiddenValue 函数获得正确的值以放入隐藏的表单标记中。但这就是我开始尝试做的事情的方式；其余的是您页面特有的详细信息。

使用 Javascript 在 hidden_field_tag 中保存一个值

Saving a value in a hidden_field_tag with Javascript

javascript

ruby-on-rails

hidden-field