收集为单选按钮 onclick
Collection as RadioButtons onclick
如何为以简单形式创建单选按钮的集合实现自动提交?
我有一个这样的输入行,我想在单击任何按钮时提交它。
=f.input :langcode, as: :radio_buttons, :collection => ['de','en'].map{|l| [image_tag('flag_'+l+'.png'), l]}, label: false
我试过在最后添加一个onclick选项,但它似乎没有做任何事情。
感谢您的帮助。
写一些真实的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
class.
附加到任何元素
您可以使用 SimpleForm 中的 input_html
选项将 class 添加到输入中:
= 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]}
虽然很臭 - 这应该从视图中提取出来并放入辅助方法或其他地方。
如何为以简单形式创建单选按钮的集合实现自动提交?
我有一个这样的输入行,我想在单击任何按钮时提交它。
=f.input :langcode, as: :radio_buttons, :collection => ['de','en'].map{|l| [image_tag('flag_'+l+'.png'), l]}, label: false
我试过在最后添加一个onclick选项,但它似乎没有做任何事情。
感谢您的帮助。
写一些真实的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
class.
您可以使用 SimpleForm 中的 input_html
选项将 class 添加到输入中:
= 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]}
虽然很臭 - 这应该从视图中提取出来并放入辅助方法或其他地方。