时间戳

首页 > 解决方案 > 集合为 RadioButtons onclick

ruby-on-rails - 集合为 RadioButtons onclick

问题描述

如何为以简单形式创建单选按钮的集合实现自动提交？

我有这样的输入行，我想在单击任何按钮时提交。

=f.input :langcode, as: :radio_buttons, :collection => ['de','en'].map{|l| [image_tag('flag_'+l+'.png'), l]}, label: false

我试图在最后添加一个 onclick 选项，但它似乎没有做任何事情。

谢谢你的帮助。

标签： ruby-on-railsradio-buttonsimple-form

解决方案

只需编写一些真正的 JavaScript：

// put this in your asset pipeline or packs
document.addEventListener('change', (event) => {
  if (!event.target.matches(".submit-on-change")) return;
  event.target.form.submit();
});
<form>
  <div>
    <input type="radio" id="male" name="gender" value="male" class="magic-button">
    <label for="male">Male</label><br>
    <input type="radio" id="female" name="gender" value="female" class="magic-button">
    <label for="female">Female</label><br>
    <input type="radio" id="other" name="gender" value="other" class="magic-button">
    <label for="other">Other</label>
   </div>
 </form>

这将创建一个简单的可重用行为，您可以通过添加submit-on-click类将其附加到任何元素。

input_html您可以使用SimpleForm中的选项向输入添加一个类：

= f.input :langcode, as: :radio_buttons, 
                     collection: ['de','en'].map{|l| [image_tag('flag_'+l+'.png'), l]}, 
                     label: false, 
                     input_html: { class: 'submit-on-click' }

['de','en'].map{|l| [image_tag('flag_'+l+'.png'), l]}虽然很臭 - 这应该从视图中提取到辅助方法或其他地方。

推荐阅读