jQuery Pelo menos 5 radio escolhidos

Controlando o submit do formulário

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').html('Tens que escolher mínimo 5').prop('disabled', true);

    // controla se tem mínimo 5 escolhidos para activar
    $('form').on("click", 'input[type="radio"]', function (e) {
        if ($("form input:radio:checked").length >= 5) {
            $('form button').html('Enviar').prop('disabled', false);
        } else {
            $('form button').html('Tens que escolher mínimo 5').prop('disabled', true);
        }
    });
})