web-dev-qa-db-fra.com

jQuery Uniform Checkbox ne vérifie pas (dés)

J'utilise jQuery Uniform pour styler les entrées/sélections, etc. Cependant, la case à cocher a cessé de fonctionner. Je suis appending données envoyées à partir d'un appel ajax. Une fois qu'il est chargé, j'utilise $.uniform.update("input:checkbox") pour mettre à jour le nouveau code HTML. En essayant de (dé) vérifier l'entrée, cela ne fonctionne qu'une fois. Si je veux (dés) vérifier à nouveau, cela ne change pas du tout.

J'ai essayé de changer le Javascript uniforme afin que toutes les actions (c'est-à-dire click, focus, blur etc.) soient sous la fonction .live. (ie. .live("click",). Cela empêche tout ce qui fonctionne. 

Mettre à jour:

J'ai entièrement lu l'Uniform JS et découvert un problème: 

if(!$(elem).attr("checked")){
    //box was just unchecked, uncheck span
    spanTag.removeClass(options.checkedClass);
}else{
    //box was just checked, check span.
    spanTag.addClass(options.checkedClass);
}

La syntaxe .attr("checked") échoue. Il retournera toujours faux. Pourquoi? Je ne sais pas. De plus, il ne met pas à jour la input d'origine pour supprimer l'attribut checked ou pour définir l'attribut checked. 

J'ai parcouru le site officiel et constaté qu'il ne mettait pas à jour la saisie de la case à cocher. Donc, il n'y a pas que moi xP

J'ai un peu cherché sur Google et trouvé diverses méthodes pour vérifier si une case à cocher est cochée, mais les méthodes suivantes échouent:

if ($(elem).attr("checked")) // The original.
if ($(elem).attr("checked") == true)
if ($(elem).is(":checked"))
if ($(elem).checked)
// and:
var check = $(elem).match(/checked=/);
if (check == null)

Les mots d’orientation sont très appréciés ~: 3

jqueryajaxcheckboxappenduniform
31
escproxy

SOLUTION SIMPLE

Cela est dû au fait que UniformJs requiert la mise à jour de votre modification sur les éléments uniformes si vous devez modifier les valeurs du formulaire de manière dynamique:

$('#checkbox').prop('checked',true);
$.uniform.update();

Modifier

Si vous souhaitez mettre à jour le #checkbox uniquement:

$('#checkbox').prop('checked',true);
$.uniform.update('#checkbox');
54
Mick

Faites juste ceci:

$('#checkbox').prop('checked',true).uniform('refresh');
18
moledet

Je sais que c'est peut-être un peu tard, mais j'espère que cela aidera quelqu'un. Je devais ajouter quelques lignes au code de l'uniforme pour qu'il recherche les cases à cocher cochées. Ce code commence à la ligne 262 pour moi. J'utilise la version uniforme 1.7.5. Les lignes entre les notes "ajouté par John" sont ce que j'ai ajouté.

        "click.uniform touchend.uniform": function(){
      if(!$(elem).attr("checked")){
        //box was just unchecked, uncheck span
        spanTag.removeClass(options.checkedClass);
      // Added by John to look for checkboxes with the attr "checked" that have been click to uncheck
      }else if(!$(elem).is(':checked')){
        spanTag.removeClass(options.checkedClass);
      // end addition by john
      }else{
        //box was just checked, check span.
        spanTag.addClass(options.checkedClass);
      }
    },
7
John Goodman

Sa fait un moment mais j'ai eu le même problème mais je l'ai résolu par une solution simple.

Uniform ajoute une span à la case à cocher et lui donne la classe checked si elle est cochée ou non, mais uniquement au chargement de la page. Si vous cochez ou décochez la case alors que la page est déjà chargée, la case sera décochée (ou cochée), mais comme la variable span est dessus, vous la verrez comme non mise à jour, vous devez le faire manuellement.

$('#myDiv input[type=checkbox]').attr('checked',true);
$('#myDiv input[type=checkbox]').parent().addClass('checked');

ou

$('#myDiv input[type=checkbox]').attr('checked',false);
$('#myDiv input[type=checkbox]').parent().removeClass('checked');

Peut-être pas la solution la plus propre, mais fonctionne bien sur tous les navigateurs.

2
Jeff B.

jQuery 1.6.4 a modifié la signification de la fonction attr(), utilisée par jquery.uniform.js. attr() renvoie maintenant l'état dans lequel l'attribut était WAS lors du chargement de la page - et non ce qu'il est maintenant. Il existe une fonction de remplacement appelée prop(), qui effectue le travail que attr() effectuait auparavant.

Pour réparer le plugin, remplacez chaque occurrence de attr("checked") par prop("checked"). Modifiez également attr("disabled") en prop("disabled").

Cela devrait réparer votre projet. Cela a fonctionné pour moi ;-)

Voir aussi: https://github.com/pixelmatrix/uniform/pull/167 , qui tente de résoudre le problème avec une compatibilité ascendante améliorée.

2
Grant

Je crois que la dernière version de Jquery utilise une méthode différente pour évaluer une valeur vérifiée. Utiliser une version légèrement plus ancienne (bien que pas idéale) a résolu ce problème pour moi. C'était il y a quelque temps cependant, et PixelMatrix ne semble toujours pas avoir mis à jour Uniform.

1
Danny

Ne pourriez-vous pas utiliser quelque chose comme

$("#checkbox").attr("checked", "true");

pour que la case à cocher soit cochée, et

$("#checkbox").removeAttr("checked");

décocher?

0
Mads Ohm Larsen

Vous n'avez pas besoin de changer .attr() en .prop():

    "click.uniform touchend.uniform": function(){
        if(!$(elem).attr('checked')){
            //box was just unchecked, uncheck span
            spanTag.removeClass(options.checkedClass);

            //Added by PingOn
            $(elem).removeAttr('checked');
            //end addition by PingOn

            // Added by John
        }else if(!$(elem).is(':checked')){
            spanTag.removeClass(options.checkedClass);
            // end addition by john

            //Added by PingOn
            $(elem).removeAttr('checked');
            //end addition by PingOn
        }else{
            //box was just checked, check span.
            spanTag.addClass(options.checkedClass);

            //Added by PingOn
            $(elem).attr('checked','true');
            //end addition by PingOn
      }
0
PingOn