Comment re-peuplez-vous les options générées dynamiquement pour un champ sélectionné?

Question

Arrière-plan J'ai deux champs de formulaire de sélection enchaînés: la durée et la fréquence. Lorsque l'utilisateur sélectionne une fréquence, les options de durée sont insérées dynamiquement. Il existe des options par défaut, mais ce sont juste pour que le champ ne soit pas vide lorsque l'utilisateur le développe.

Par exemple, les options de fréquence sont "jour", "autre jour" et "semaine". Si je sélectionne "jour", les options de fréquence changent en "5 jours", "15 jours" et "30 jours".

Problème Le problème survient lorsque l'utilisateur soumet le formulaire contenant des erreurs. Le formulaire est renvoyé avec tous les champs de formulaire remplis et les erreurs sont mises en surbrillance, à l'exception du champ de sélection de fréquence, dont les options sont générées de manière dynamique. Il n'est pas mis en surbrillance et ses options sont les options par défaut.

Est-il possible que ces options soient à nouveau renseignées si l'utilisateur envoie une erreur. Nous sommes en train de faire un peu de validation JavaScript, alors cette situation ne devrait pas arriver aussi souvent, mais nous aimerions faire en sorte que l'erreur soit une expérience aussi simple que possible pour les utilisateurs.

Code J'utilise jquery et un plugin jquery appelé cascade pour chaîner les deux champs. ( http://plugins.jquery.com/project/cascade )

Voici mon code JavaScript personnalisé.

Ce script génère la liste des options:

var list1 = [
    {'When':'86400','Value':' ','Text':' '},
    {'When':'172800','Value':' ','Text':' '},
    {'When':'604800','Value':' ','Text':' '},
    {'When':'86400','Value':'432000','Text':'5 days'},
    {'When':'86400','Value':'1296000','Text':'15 days'},
    {'When':'86400','Value':'2505600','Text':'30 days'},
    {'When':'172800','Value':'1296000','Text':'15 days'},
    {'When':'172800','Value':'2505600','Text':'30 days'},
    {'When':'172800','Value':'3888000','Text':'45 days'},
    {'When':'604800','Value':'2505600','Text':'4 weeks'},
    {'When':'604800','Value':'3715200','Text':'6 weeks'},
    {'When':'604800','Value':'4924800','Text':'8 weeks'}
];

function commonTemplate(item) {
    return "<option value='" + item.Value + "'>" + item.Text + "</option>"; 
};

function commonMatch(selectedValue) {
    return this.When == selectedValue; 
};

Et voici le script qui déclenche la génération des options de sélection:

jQuery("#duration).cascade("#frequency",{
    list: list1,            
    template: commonTemplate,
    match: commonMatch          
})

La question Avez-vous des idées sur la manière de reconstituer les options de fréquence générées dynamiquement lorsque le formulaire est renvoyé au navigateur avec des erreurs? Pourrais-je utiliser le plugin cascade que j'utilise actuellement ou une autre méthode?

L’aide est grandement appréciée. : -)

Answer 1

Je ne connais pas bien ce plug-in, mais vous ne pouvez pas simplement déclencher l'événement change () de #duration et / ou #frequency sur document.ready?

$(document).ready(function() {
    $('#duration').change();
    $('#frequency').change();
});

Je suis à peu près sûr que tout le script est en train de lier des éléments à l'événement change de la sélection (au moins par défaut), de sorte que cela devrait déclencher le plugin pour qu'il fonctionne comme par magie ...