Cocher plusieurs checkboxs.

Fall Throne
Javascript

Salut à tous.
Je vous explique mon problème.
J'ai une page php avec deux boutons me permettant d'appeler deux pages avec du contenu différent. (AJAX avec la fonction load()).
Sur une de ces pages, j'ai plusieurs checboxs, dont une, qui quand on la coche, toutes les autres checkboxs soit cochées, et qui, quand on la décoche, que toutes les autres checkboxs soit décochées.

J'ai d'ailleurs utilisé plusieurs syntaxes :

$('#search_engine').on( 'click', '#sec_tout', function() {
        if (this.checked) {
            $(':checkbox.checksec').attr('checked', true);
        } else {
            $(':checkbox.checksec').attr('checked', false);
        }
    });

ou encore celle-ci : 

$('#search_engine').on( 'click', '#sec_tout', function() {
        var checkbox = $('#search_more').find(':checkbox');
        if ($('#sec_tout').is(':checked')) {
            checkbox.attr( 'checked', true );
        } else {
            checkbox.attr( 'checked', false );
        }
    });

Mais quelque soit la syntaxe que j'utilise, j'ai toujours le même problème. En cochant la case toutes les checkboxs se cochent. En décochant la case toutes les checboxs se décochent. Mais après si je coche une nouvelle fois la case, seul celle que j'ai coché se coche, les autres ne se coche plus. Donc en gros cela marche que deux fois, les deux première fois, quand je coche et décoche.

Si je charge l'autre page et que je charge une nouvelle fois celle contenant les checkboxs cela remarche mais toujours que deux fois (un coche et un décoche).

Je comprend pas pourquoi cela. Voilà ce que cela me fait : http://jsfiddle.net/nra5fxwh/8/

Merci de vos futures réponses.

3 réponses

Maenhyr
Réponse acceptée

Bonjour,
Il faut utiliser .prop() au lieu de .attr(), si tu utilises jQuery 1.6+.

$('#search_engine').on( 'click', '#sec_tout', function() {
        if (this.checked) {
            $(':checkbox.checksec').prop('checked', true);
        } else {
            $(':checkbox.checksec').prop('checked', false);
        }
    });
Fall Throne
Auteur

Merci beaucoup, en effet cela marche. D'ailleurs j'avais le même problème avec mon autre page où je devais changer les class d’élément cliqué, cela me le faisait seulement sur le premier élément cliqué, après plus rien. Je suis étonné que attr() ne marche pas vraiment, j'ai pu lire des tutoriels et il est toujours utilisé.

Fall Throne
Auteur

Par contre je comprends pas pourquoi cela ne marche pas avec disabled. Quand je clique sur le premier bouton je veux le désactiver et activer le deuxième bouton. Quand je clique sur le deuxième bouton je veux le désactiver et activer le premier bouton. Et dans ces cas ci, prop() et removeProp() ne marche pas mais attr() et removeAttr() si.
http://jsfiddle.net/pkwmnxtt/9/