Domanda

Sfondo Ho due campi di forma selezionati concatenati insieme: durata e frequenza. Quando l'utente seleziona una frequenza, le opzioni di durata vengono inserite in modo dinamico. Ci sono opzioni predefinite, ma sono solo in modo che il campo non sia vuoto quando l'utente lo espande.

Ad esempio, le opzioni di frequenza sono "giorno", "altro giorno" e "settimana". Se seleziono "giorno", le opzioni di frequenza cambiano in "5 giorni", "15 giorni" e "30 giorni".

problema Il problema si presenta quando l'utente invia il modulo con errori, il modulo viene restituito con tutti i campi del modulo ripopolati e gli errori evidenziati, ad eccezione del campo di selezione Frequenza, le cui opzioni vengono generate dinamicamente. Non è evidenziato e le sue opzioni sono le opzioni predefinite.

È possibile ripopolare queste opzioni se l'utente invia un errore. Stiamo facendo un bel po 'di validazione JavaScript, quindi questa situazione non dovrebbe succedere così spesso, ma vorrebbe rendere un errore il più indolore possibile per gli utenti.

Codice Sto usando jquery e un plugin jquery chiamato cascade per concatenare i due campi insieme. ( http://plugins.jquery.com/project/cascade )

Ecco il mio JavaScript personalizzato.

Questo script genera l'elenco di opzioni:

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; 
};

E questo è lo script che attiva la generazione delle opzioni selezionate:

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

La domanda Qualche idea su come ottenere la ripopolazione delle opzioni di frequenza generate dinamicamente quando il modulo viene restituito al browser con errori? Potresti usare il plug-in a cascata che sto attualmente usando o qualche altro metodo?

L'aiuto è molto apprezzato. : -)

È stato utile?

Soluzione

Non ho familiarità con questo plugin, ma non potresti semplicemente lanciare l'evento change () di #duration e / o #frequency su document.ready?

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

Sono abbastanza sicuro che tutto ciò che lo script sta facendo sia vincolante per l'evento change della selezione (per impostazione predefinita, almeno) in modo che il plug-in funzioni in modo magico ...

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top