如何在未单击单选按钮时防止表单提交

How to prevent a form submission if radio button is not clicked

本文关键字:表单提交 单选按钮 单击      更新时间:2023-09-26
var $form = $('#style');
    var $radio = $('.changeprice');
    $form.submit( function(e) {
        if(!$radio.is(':checked')) {
            alert('Please confirm!');
            e.preventDefault();
        }
    });     

这是我在文档就绪函数中的 JS 代码。

这是与 HTML 表单相关的代码

<%= simple_form_for @order, url: wizard_path, :method => :put, id: 'style' do |f| %> 
    <input type="radio" id="1" class="changeprice"  />
    <input type="radio" id="2" class="changeprice"  />
<%end %>

只需将 HTML 5 标签 required 放在其中一个单选按钮上即可。 把它放在一个上,以便在提交之前至少需要集合中的一个。 您的 JS 无需在没有选择的情况下停止提交表单。

<%= simple_form_for @order, url: wizard_path, :method => :put, id: 'style' do |f| %> 
    <input type="radio" id="1" class="changeprice" required />
    <input type="radio" id="2" class="changeprice"  />
<%end %>