Invia campi nascosti in un modulo html

Question

Per un modulo HTML di base, desidero separare il modulo in tre schede, ciascuna scheda conterrà determinati campi e quando si invia il modulo desidero che tutti i dati nei tre moduli siano in grado presentare.

Così ho un menù creato da <ul> e <li>

<ul class="subnav"> 
    <li class="subnav0 current"><a href="javascript:showTab('tab1');">Tab1</a></li> 
    <li class="subnav1"><a href="javascript:showTab('tab2');">Tab2</a></li> 
    <li class="lastItem subnav2"><a href="javascript:showTab('tab3');">Tab3</a></li> 
</ul> 

e sotto questo menu, ho tre div che rappresentano ogni scheda:

<div class="tab1"></div> 
<div class="tab2 displayNone"></div> 
<div class="tab3 displayNone"></div> 

L'ingresso controlla elementi saranno essere inserito in ciascuna scheda div. E il javascript nella barra di navigazione del menu controllerà quale scheda visualizzare tramite chiamata show() & hide() metodo di ogni div. (Utilizzando jQuery).

Ora il mio problema è:

1) Voglio essere in grado di presentare l'intero modulo (tutti i comandi a tre div). Tuttavia, i moduli html non invieranno i controlli di input all'interno di un div displayNone, il che significa che potrò solo inviare i dati all'interno della scheda che sto visualizzando, ma non le altre due schede.

2) Voglio anche fare alcune funzioni javascript sugli elementi hide quando si inizializza il modulo in tab2 o tab3. Tuttavia, dal momento che sono visualizzati: nessuno, il javascript non avrà alcun effetto.

Quindi c'è un modo in cui posso in qualche modo nascondere il div, ma anche essere in grado di inviare il modulo e fare qualsiasi operazione javascript su di esso?

Answer 1

Secondo il display W3C: nessuno Controlli possono ancora essere inviate al server, in quanto sono considerati controlli Successsful

17.13.2 controlli a buon esito

Un controllo di successo è "valido" per la presentazione . Ogni controllo riuscito di ha il suo nome di controllo abbinato al suo valore corrente come parte di il set di dati del modulo inviato. Un controllo riuscito deve essere definito all'interno di un elemento FORM e deve avere un nome di controllo.

Tuttavia:

• I controlli che sono disabile non può avere successo.
• Se un modulo contiene più di un pulsante di invio, solo il pulsante di invio attivato ha esito positivo.
• Tutte le caselle di controllo "on" possono essere selezionate con successo .
• Per i pulsanti di opzione che condividono lo stesso valore di l'attributo nome, solo il pulsante di opzione "on" può essere riuscito.
• Per i menu, il nome del controllo è fornito da un elemento SELECT ei valori sono forniti dagli elementi OPTION. Solo le opzioni selezionate possono avere successo.
• Se nessuna opzione è selezionata, il controllo non ha esito positivo e il nome e il valore non vengono inviati al server quando il modulo è inviato .
• Il valore corrente di un file selezionato è un elenco di uno o più nomi di file.Al momento dell'invio del modulo, i contenuti di ciascun file vengono inviati con il resto dei dati del modulo. I contenuti del file sono imballati in base al tipo di contenuto del contenuto.
• Il valore corrente di un controllo oggetto è determinato da implementazione dell'oggetto.

Se un controllo non ha un valore di corrente

quando il modulo viene inviato, agenti utente non sono tenuti trattarlo come controllo di successo.

Inoltre, i programmi utente non dovrebbero considerare i seguenti controlli successo:

pulsanti di reset. Elementi OBJECT il cui attributo declare è stato impostato. I controlli e i controlli nascosti che non sono stati renderizzati a causa delle impostazioni dello stile potrebbero comunque riuscire.

Ad esempio:

<FORM action="..." method="post"> 
<P> 
<INPUT type="password" style="display:none" 
      name="invisible-password" 
      value="mypassword"> 
</FORM> 

sarà ancora causare un valore per essere accoppiato con il nome "invisibile-password" e presentato con la forma.

In ogni caso, se quello non sembra funzionare perché non provare jQuery serialize() o serializeArray() in ogni forma e concatenare i valori e li ajax al server.

Answer 2

Sul primo punto, solo perché un input non ne visualizza nessuno, non significa che non invierà quei campi.

Sul secondo punto, non seguo del tutto. Stai dicendo che quando apri una delle schede, vuoi fare qualche azione sul contenuto? Se è così, JQuery UI permette di fare questo: -

http://jqueryui.com/demos/tabs/#event-show

si può dare un esempio più completo, tra cui il tag form e alcuni input?