程序员经验分享-hwhale

将 html ID 添加到 Rails 选择选项

2024-01-04

我们正在使用simple_form并尝试添加一个id对每一个特定的select_tag's选项。这是我们的选择：

<%= f.input :category, collection: %w{ Football Basketball Golf Soccer }, :include_blank => "Choose one" %>

这就是它的内容can添加后看起来像id/ids

<select class="select required form-control" id="sport_category" name="sport[category]">
  <option value="">Choose one</option>
  <option value="Football">Football</option>
  <option id="addBehavior" value="Basketball">Basketball</option>
  <option value="Golf">Golf</option>
  <option value="Soccer">Soccer</option>
</select>

但这也可以工作（添加一个id每个选项）

<select class="select required form-control" id="sport_category" name="sport[category]">
  <option value="">Choose one</option>
  <option id="football" value="Football">Football</option>
  <option id="basketball" value="Basketball">Basketball</option>
  <option id="golf" value="Golf">Golf</option>
  <option id="soccer" value="Soccer">Soccer</option>
</select>

我们想要添加 js 行为来在特定的情况下触发事件option已选择并计划使用getElementById来定位该选项。这就是为什么我们要添加一个id选项......实际上只有篮球选项。


尝试使用，

<%= f.input :category, collection: %w{ Football Basketball Golf Soccer }.map { |category| [category, category, {:id => category}]}, :include_blank => "Choose one" %>

当我尝试时，它给了我 html

<option value="">Choose one</option>
<option id="football" value="Football">Football</option>
<option id="basketball" value="Basketball">Basketball</option>
<option id="golf" value="Golf">Golf</option>
<option id="soccer" value="Soccer">Soccer</option>

可能有一种更干净的方法来做到这一点，但它确实有效。

如果你也这样做，

<%= f.input :category, collection: [["Football", "football"], ["Basketball", "basketball", {:id => "basketball"}], ["Golf", "golf"], ["Soccer", "soccer"]], :include_blank => "Choose one" %>

这给了我html，

<option value="">Choose one</option>
<option value="Football">Football</option>
<option id="basketball" value="Basketball">Basketball</option>
<option value="Golf">Golf</option>
<option value="Soccer">Soccer</option>

再说一次，可能有一种更干净的方法来做到这一点！但至少对我有用。

希望这可以帮助

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

jQuery

rubyonrails

simpleform

将 html ID 添加到 Rails 选择选项 的相关文章

  • .points 不透明度/大小在三个.js 内

    我回来回答有关 points 的第二个问题 这次想知道如何将不透明度从 0 更改为 1 然后又回到距发射器的特定像素距离内 var particleCount 14 particles new THREE Geometry pMateria

  • jquery 中的函数返回未定义[重复]

    这个问题在这里已经有答案了 我在 jquery 中调用的函数返回未定义 我检查了该函数 当我对其进行调试时 它返回正确的数据 function addToPlaylist component type add to pl value pl

  • .removeClass 从所有元素（相对于单个定义的元素）

    我将如何使用 removeClass 删除所有匹配的类 而不是单独调用每个元素 所以代替这个 input removeClass CO form alert select removeClass CO form alert input se

  • 返回视图作为 JSON 对象的一部分

    我有一个应用程序只加载一次完整视图 我这样做的原因并不重要 重要的是 其余内容只会以部分视图的形式返回 除了一些内容之外 我还有一些 JSON 对象 我想通过每个 AJAX 请求在服务器之间来回传递 有没有办法返回一个 JSON 对象 并将

  • 可以禁用幻灯片的触摸模拟但不能禁用滚动条（危险的滑动器）吗？

    我的页面上有一个危险的滑动器 它成功地模拟了幻灯片和随附滚动条上的触摸事件 允许单击鼠标并移动以向左或向右滑动幻灯片 这很好 但我现在在滑动器内的幻灯片上调用了可拖动 这意味着我需要停止此触摸模拟 拖动幻灯片并同时移动它们会引起混乱 但仅限

  • 播放没有音频标签的音频

    是否可以在没有音频标签的情况下仅使用 javascript 播放音频 我通过 tinyMce 编辑器注入脚本 因为我无权访问网站的后端 并且它不支持客户端的音频标签 她只想要当您将鼠标悬停在图像上时发出简单的声音 我已经完成了所有设置 但是

  • 如何在React中动态分配属性？

    这是一个有两个参数的函数 我要创建的标签的名称 具有以下属性的对象 Using React 我创建一个组件并将该元素渲染到 DOM 问题是我想向元素添加属性 但它不允许循环在元素内设置属性 var Element function elem

  • node.js 模块/导出系统：是否可以将模块导出为函数

    我想在 Dispatch js 中做这样的事情 function handle msg exports handle 这在调用index js中 var dispatch require Dispatch dispatch data 有任何

  • 如何从 CSS 选择器中提取类名？

    故事 我目前正在构建一个 ESLint 规则 以警告在 CSS 选择器定位器中使用引导布局导向和角度技术类 目前我在字符串方法中使用简单的子字符串 for var i 0 i lt prohibitedClasses length i if

  • 在反应中访问回调内的 event.target

    我有以下课程片段 constructor props super props this timeout null search e gt clearTimeout this timeout this timeout setTimeout f

  • 为什么每个方法需要将其循环的值分配给变量？

    在 Rails 上工作 发现我对 Rails 的理解缺乏知识each method 不知道为什么each方法需要变量 message h2 h2 不确定为什么每个方法都需要变量 message 事实并非如此require它 你完全可以忽略它

  • 如何解决“消息端口在收到响应之前已关闭”的问题。在 JavaScript 中的 window.location.reload() 之后

    我遇到了 javascript 问题 从 chrome v73 0 3683 86 开始 每当我在 window location reload 函数之后运行 javascript 代码时 它总是给我错误 Unchecked runtime

  • Rails & Devise：如何在没有布局的情况下呈现登录页面？

    我知道这可能是一个简单的问题 但我仍在试图弄清楚Devise https github com plataformatec devise out 我想要render layout gt false在我的登录页面上 我怎样才能做到这一点Dev

  • onPress 方法中箭头函数与普通函数的行为

    正在学习 Native React 并学习更多关于 javascript 的知识 所以我仍然不明白它的行为的很多事情 我使用 TouchableOpacity 及其 onPress 属性创建了一个按钮组件 为了让它工作 我必须发送我想要执行

  • Three.js点击单个粒子

    In this example http jsfiddle net agqq96bq 2 您可以看到 2 个可点击的粒子 但它们都受到点击的影响 另外 我只想检测粒子上的点击 而不将它们过滤出场景 像这儿 if intersects len

  • Graphql 将多个查询合并（组合）为一个？

    我正在尝试使用 JavaScript 将多个 GraphQL 查询合并为一个查询 我正在寻找这样的东西 let query3 mergeQueries query1 query2 我们事先不知道哪些查询将被组合 假设我有这样的查询 输入查询

  • 如何最好地将地址关联到 Rails 中的多个模型？

    这个问题 https stackoverflow com questions 648463 best way to model customer addresson SO 似乎与我的问题有关 但我不确定我的问题是否得到了回答 一个地址可以属

  • 将网站加载到 DIV 中

    当我在文本框中写入 URL 然后单击提交按钮时 如何实际从网站检索数据 我希望将数据放入我拥有的 div 中 这可能吗 我已经尝试过这个 但它不起作用

  • JavaScript 阶乘防止无穷大

    我一直在 JavaScript 中使用这个函数来计算阶乘数 var f function factorial n if n 0 n 1 return 1 if f n gt 0 return f n return f n factorial

  • 如何在控制器中获取f.submit的名称参数？

    我创建了 form html erb 其中的编码如下 是的 我确实有两个相同表单的提交 并且它们都有 更新 和 销毁 等名称 当用户按下销毁按钮时 books controller 中的更新操作将被调用 并判断是 更新 还是 销

随机推荐

  • 使用 CSS 删除焦点选项卡的发光边框

    我正在尝试删除蓝色发光边框 当窗格聚焦于我的 javaFX 应用程序中选项卡窗格中的选项卡时 会出现该边框 关于如何在 css 中执行此操作有任何想法吗 这是我当前的CSS tab fx background radius 0 fx bac

  • 为什么只有ListView.builder()中的内容不滚动？

    我有一个带有文本小部件和 ListView 的屏幕 当我尝试在 ListView 内滚动时 它不允许我滚动 我的主体是 SingleChildScrollView 但不为 ListView builder 提供滚动视图 我尝试将 ListV

  • 为什么在 Fortran 中某些数组没有正确对齐以进行矢量化？

    我正在尝试通过矢量化 for 循环来改进 Fortran 77 代码 我对矢量化相当陌生 虽然我可以获得矢量化代码 但优化报告告诉我 我的一些数组具有未对齐的访问权限 据我了解 这使得矢量化效率较低 我已手动向数组添加填充 以便对齐数据 这

  • R闪亮：在完成所有observeEvent代码之前更新tabsetpanel

    我想立即更新选项卡面板 而不是等到完成下载功能 在这里你可以找到一个简单的代码它有一个按钮 当按下它时 它会模拟下载并更新选项卡面板 我想在完成下载之前更新面板 Thanks server lt function input output

  • 如何更改 Win32 API 应用程序中的控件主题？

    如果我在 Win32 API 中创建一个按钮 则默认控制主题看起来像 Windows 95 98 按钮 我记得过去微软论坛告诉我如何获得XP风格 但我不记得如何做到这一点 有没有办法以编程方式或手动更改 Win32 应用程序中的控件主题 谢

  • 如何在 matplotlib 中调整（偏移）颜色条标题

    给出以下代码 imshow np arange 16 16 reshape 16 16 cb colorbar cb set label Foo cb set ticks 0 255 其产生 如何调整颜色条文本 Foo 使其向左偏移 在 0

  • 在 swift 4 中未调用通知中心观察者

    我正在尝试从 appdelegate 发布通知 NotificationCenter 并在另一个视图中接收通知 但未收到通知 发布通知 func xmppStream sender XMPPStream didReceive message

  • formGroup 需要一个 FormGroup 实例

    我在 Plunkr 上有一个 Angular 2 RC4 基本表单示例 它似乎抛出以下错误 在 Chrome DEV 控制台中 这是笨蛋 https plnkr co edit GtPDxw p preview https plnkr co

  • 如何将二叉搜索树转换为双向链表？

    给定一个二叉搜索树 我需要仅使用指向 C 中结构的指针将其转换为双向链表 通过以锯齿形顺序遍历 如下所示 给定树 1 2 3 4 5 6 7

  • jQuery - 如何检测项目当前是否在视口之外？

    我正在构建一个页面 该页面将使用 ajax 来更新主要内容区域 用户将单击左侧菜单栏中的项目来更新右侧的 div 并包含搜索结果 我想检测用户是否已向下滚动到目前为止 导致右侧结果 div 移出视口 但有人检测到这一点吗 没有测试 跨浏览器

  • WPF - 在代码隐藏中更改网格中控件的位置

    是否可以从代码隐藏更改控件在网格中的放置位置 例如 如果我在 Grid Row 1 中有一个按钮 我可以将其从代码隐藏更改为 Grid Row 0 吗 是的 去吧 Grid SetRow button 0 其中 button 是要更改的元素

  • 依赖注入wcf

    我想在 WCF 中注入接口的实现 但我想在 WCF 客户端中初始化依赖注入容器 因此 我可以为我的服务的每个客户端提供不同的实现 当你使用svcutil exe or the 添加服务参考在 Visual Studio 中的向导中 自动生成

  • 为什么这个 %2B 字符串会被 urldecode ？

    这可能不完全是一个编程问题 但它是一个最好由程序员来回答的难题 我首先在专业网站管理员网站上尝试过 结果一片寂静 我们的网站上有电子邮件地址验证流程 该站点首先生成一个适当的密钥作为字符串 mykey 然后将该密钥编码为一堆字节 dac 然

  • jQuery 拖放到文本区域

    使用 jQuery 并希望让用户将占位符拖到文本区域中 每个占位符都是一个 span 其中有一个class placeholder 文本区域id简直就是 main text 因此 用户应该能够拖动每个占位符span将其放在文本区域顶部 然后

  • 我可以为多个 Meteor 应用程序使用同一个数据库吗？

    用例 我构建的应用程序app foo com 以及望远镜的实例community foo com 在单独的应用程序服务器上 他们唯一分享的收藏是users 我会给这两个应用程序提供相同的 mongo url 和 oplog url 并确保除

  • LyX->Rnw 转换会自动在重复的“<”字符之间插入连字符

    标题说明了一切 下面的屏幕截图给出了血淋淋的细节 临时缓冲区文件夹中的 Rnw 文件与图像中的 LaTeX Source 相同 正如您可以想象的 knit 不会编织this废话 我一生都无法弄清楚如何让这些结扎断裂消失 所以我想我的问题是

  • 计算卷积神经网络中特征图的维度

    我在 Keras 中有卷积神经网络 我需要知道每层特征图的尺寸 我的输入是 28 x 28 像素图像 我知道有一种方法可以计算这个我不知道如何 下面是我使用 Keras 的代码片段 img rows img cols 28 28 nb fi

  • 将包含指向另一个结构的指针的结构传递给 CUDA 中的内核

    我有两个结构 struct collapsed char seq int num struct data collapsed x int num int numblocks int blocksizes float regmult floa

  • ARPACK 线程安全吗？

    使用是否安全ARPACK http www caam rice edu software ARPACK用 C 编写的程序同时来自不同线程的特征求解器 或者 如果 ARPACK 本身不是线程安全的 那么是否有一个与 API 兼容的线程安全实现

  • 将 html ID 添加到 Rails 选择选项

    我们正在使用simple form并尝试添加一个id对每一个特定的select tag s选项 这是我们的选择 这就是它的内容can添加后看起来像id ids

热门标签