Go to English Blog

Lidando com checkbox no JQuery

Leia em menos de um minuto

Se você precisa lidar com checkboxes e está usando JQuery, veja este plugin que criei.

/*
Author: Nando Vieira
License: Public Domain
*/
jQuery.fn.check = function(mode)
{
    mode = mode || 'on';

    return this.each(function(){
        if (this.type == 'checkbox') {
            jQuery.fn._setCheckboxState(this, mode);
        } else {
            $(this).field('checkbox').each(function(){
                jQuery.fn._setCheckboxState(this, mode);
            });
        }
    });
}

jQuery.fn._setCheckboxState = function(checkbox, mode)
{
    switch (mode) {
        case 'toggle':
            checkbox.checked = !checkbox.checked;
            break;

        case 'off':
            checkbox.checked = false;
            break;

        case 'on':
            checkbox.checked = true;
            break;
    }
}

jQuery.fn.field = function(type, filter)
{
    var rule;
    filter = filter || '';

    if(type == 'all' || !type) {
        rule = 'input|textarea|select';
    } else {
        if (type != 'select' && type != 'textarea') {
            rule = 'input[@type=' + type + ']';
        } else {
            rule = type;
        }
    }

    return jQuery(rule, this).not(filter);
}

Se preferir, pode passar o próprio elemento:

$('form fieldset#preferences input[@type=checkbox]').check();

De quebra, você leva uma função que retorna todos os elementos de formulário identificados pelo tipo. Por exemplo, para retornar todos os campos "password", você pode usar:

$('form').field('password').each(function(){
    alert($(this).name());
});

Você também pode filtrar quais campos quer exibir. O exemplo abaixo pega todos os campos do formulário, com exceção de "password":

$('form').field('all', '[@type=password]').each(function(){
    alert($(this).name() + ' = ' + $(this).val());
});

Campos do tipo "select" e "textarea" também entram na lista de "input".

Download: jquery-checkbox.js
Tamanho: 912 bytes

Bug Fix