jQuery Pelo menos 5 radio escolhidos

Controlando o submit do formulário sem UI

by Salustiano Silva

HTML

<form>
    <div>
        <input type="radio" name="group[001]" id="1">apple
        <input type="radio" name="group[001]" id="2">pineapple
        <input type="radio" name="group[001]" id="3">melon
    </div>
    <div>
        <input type="radio" name="group[002]" id="4">strawberry
        <input type="radio" name="group[002]" id="5">orange
        <input type="radio" name="group[002]" id="6">kiwi
    </div>
    <div>
        <input type="radio" name="group[003]" id="7">MTV
        <input type="radio" name="group[003]" id="8">CNN
        <input type="radio" name="group[003]" id="9">PANDA
    </div>
    <div>
        <input type="radio" name="group[004]" id="10">StackOverflow
        <input type="radio" name="group[004]" id="11">StackOverflow PT
        <input type="radio" name="group[004]" id="12">SuperUser
    </div>
    <div>
        <input type="radio" name="group[005]" id="13">Raquel
        <input type="radio" name="group[005]" id="14">Sofia
        <input type="radio" name="group[005]" id="15">Sara
    </div>
    <p>
        <button>Enviar</button>
    </p>
</form>

JavaScript

$(function () {
    // desactiva por defeito
    $('form button').prop('disabled', true);

    // controla se tem mínimo 5 escolhidos para activar
    $('form').on("click", 'input[type="radio"]', function (e) {
        $('form button').prop('disabled', ($("form input:radio:checked").length < 5));
    });
});