Élargir un volet d'accordéon sur la validation invalide

Question

J'ai une collection d'accordéonives contenant diverses commandes de Textbox et des luttes déroulantes, chacune avec leurs propres validateurs.

Si quelques validations côté serveur se produisent sur le formulaire Soumettre, y a-t-il quelque chose qui peut agrandir automatiquement un volet auparavant minimisé contenant le message Validator non valide?Sinon, il semblera à l'utilisateur que la forme n'est pas soumise sans raison.

Un autre scénario: disons que j'ai plusieurs vitres avec côté client validateurs liés aux entrées.Si une vitre est minimisée (et vous ne pouvez donc pas voir l'erreur du validateur), existe-t-il un moyen d'élargir le volet approprié lorsque la validation de la page AJAX se produit sur Soumettre?

Je sais qu'il y a une voie de force brute à cette approche, où je garde une trace de chaque validateur et leur accordéonaque associé, mais j'espérais une meilleure solution capable de gérer ma situation pour un grand nombre d'entrées / validateurs et de vitres..

Answer 1

Que diriez-vous de quelque chose comme ceci (en utilisant jQuery mais je suis sûr qu'il peut être converti en JavaScript uni) ...

$(document).ready(function(){
    if (isPostback()){
        $.each(Page_Validators, function(index, validator) {
            if (!validator.isvalid) {
            // do something here to locate the accordion based on the validator
            // $(this) is the currently invalid validator element as a jquery object/wrapped set
            // so for example...
                $(this).parent().slideDown();
            // This assumes that the immediate parent of of the validator is the accordion which is unlikely but if you post your emitted html I can write the appropriate selector for you.  
            }
        });
    }
});

Parce que vous ne voulez pas qu'il fût sur la charge initiale, vous pouvez utiliser une technique comme celle-ci Comment détecter / suivre le message en JavaScript? et vérifier si vous êtes dans un message après le document.ready - j'ai supposé que vous avez utilisé les conseils dans le lien et que votre fonction de détection de post-pack est appelée ispostback().

Answer 2

Il y a un projet construit pour ce numéro, essayez de jeter un coup d'œil à cela .... Vous pouvez également télécharger la source pour analyser plus de détails ou utiliser la même base de code si vous voulez ... http://www.codeproject.com/articles/43397/validant-Accordion-and-radpanelbar-with-ajax-an

Answer 3

Rich me frappe, mais voici la version Vanilla JS (IE9 +):

Page_Validators
    .filter(function(v) { return !v.isvalid; })
    .forEach(function (v) { console.log(v.parentNode); });

N'oubliez pas de placer le code sous le -tag.J'ai eu des problèmes avec l'utilisation de jQuerys Document.Ready and WindowLoad, car il peut exécuter le code avant que tout le JavaScript nécessaire à partir d'ASP.NET est chargé.

mise à jour: une version compatible plus de navigateur

for(var i = 0; i < Page_Validators.length; i++) {
    var validator = Page_Validators[i];
    if (!validator.isvalid) {
        console.log(validator.parentNode);
    }
}