51 votes

À l'aide de JQuery Valider Plugin pour valider plusieurs champs de formulaire avec des noms identiques

J'ai généré dynamiquement, un formulaire avec des champs de saisie avec le même nom (par exemple: "la carte"). Je n'ai pas la possibilité de changer les noms de champ ou de la génération de champ unique des noms, parce que le gestionnaire de formulaire code (Perl/CGI) est conçu pour gérer un tableau de valeurs d'entrée (dans ce cas - @map).

Comment puis-je utiliser le JQuery Valider Plugin pour valider un formulaire dans une telle situation? Plus précisément je voudrais exactement un élément du tableau pour avoir une certaine valeur fixe. Je suis actuellement en utilisant un gestionnaire d'événements personnalisés qui crée un objet JSON avec serializeArray() puis traverse pour s'assurer que la condition est remplie. Mais depuis que j'ai utilisé de la validation de Plugin dans le reste de l'application, je me demandais si un tel cas peut être traité en utilisant la même plugin ici aussi.

Je vous remercie pour votre attention.

71voto

Ahmed Galal Points 367

Comme je ne peux pas commenter sur @scampbell réponse, je ne sais pas si il est sur le points de réputation ou parce que le fil vient de fermer ses portes, j'ai une contribution à sa réponse,

Au lieu de changer le fichier de source de jquery.la validation, vous pouvez simplement remplacer la fonction vous avez besoin de modifier uniquement dans les pages qui en a besoin.

un exemple serait:

$.validator.prototype.checkForm = function () {
                //overriden in a specific page
                this.prepareForm();
                for (var i = 0, elements = (this.currentElements = this.elements()); elements[i]; i++) {
                    if (this.findByName(elements[i].name).length != undefined && this.findByName(elements[i].name).length > 1) {
                        for (var cnt = 0; cnt < this.findByName(elements[i].name).length; cnt++) {
                            this.check(this.findByName(elements[i].name)[cnt]);
                        }
                    } else {
                        this.check(elements[i]);
                    }
                }
                return this.valid();
            }

cela pourrait ne pas être la meilleure solution, mais au moins cela évite d'éditer les fichiers source qui pourrait être remplacée plus tard, quand une nouvelle version de presse. où votre remplacé fonction pourrait ou ne pourrait pas briser

58voto

scampbell Points 460

Vieux thread, je sais, mais je suis venu à travers elle, à la recherche d'une solution au même problème.

Une solution plus élégante a été posté ici: http://web-funda.blogspot.com/2009/05/jquery-validation-for-array-of-input.html

Il vous suffit de modifier jquery.validate.js et changer le checkForm à

    checkForm: function() {
    this.prepareForm();
    for ( var i = 0, elements = (this.currentElements = this.elements()); elements[i]; i++ ) {
        if (this.findByName( elements[i].name ).length != undefined && this.findByName( elements[i].name ).length > 1) {
            for (var cnt = 0; cnt < this.findByName( elements[i].name ).length; cnt++) {
                    this.check( this.findByName( elements[i].name )[cnt] );
            }
        } else {
            this.check( elements[i] );
        }
    }
    return this.valid();
}

11voto

Ya. Perelman Points 1926

J'ai juste appris à partir d'un mail par les Plugins auteur, Jörn Zaefferer, que la validation nécessite des noms de champs à être unique, sauf pour les boutons radio et les cases à cocher.

5voto

Steve Farthing Points 21

Jason réponse fera l'affaire, mais je ne voulais pas ajouter des événements de clic sur chaque formulaire je l'ai fait sur.

Dans mon cas, j'ai le plugin de validation envisager des noms se terminant par '[]' différentes, même si elles peuvent être identiques fieldnames. Pour ce faire, j'ai a remplacé ces deux méthodes internes après jquery.validate.js les charges.

$.validator.prototype.elements= function() {
var validator = this,
    rulesCache = {};

// select all valid inputs inside the form (no submit or reset buttons)
// workaround $Query([]).add until http://dev.jquery.com/ticket/2114 is solved
return $([]).add(this.currentForm.elements)
.filter(":input")
.not(":submit, :reset, :image, [disabled]")
.not( this.settings.ignore )
.filter(function() {
    !this.name && validator.settings.debug && window.console && console.error( "%o has no name assigned", this);

    // select only the first element for each name (EXCEPT elements that end in []), and only those with rules specified
    if ( (!this.name.match(/\[\]/gi) && this.name in rulesCache) || !validator.objectLength($(this).rules()) )
        return false;

    rulesCache[this.name] = true;
    return true;
});
};


$.validator.prototype.idOrName = function(element) {

// Special edit to get fields that end with [], since there are several [] we want to disambiguate them
// Make an id on the fly if the element doesnt have one
if(element.name.match(/\[\]/gi)) {
    if(element.id){
        return element.id;
    } else {
        var unique_id = new Date().getTime();

        element.id = new Date().getTime();

        return element.id;
    }
}

return this.groups[element.name] || (this.checkable(element) ? element.name : element.id || element.name);
};

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X