Come nascondere un DIV su un postback in JavaScript

January 5

Come nascondere un DIV su un postback in JavaScript


Utilizzando un metodo postback per i moduli --- dove la stessa pagina sia contiene il modulo e lo elabora --- può aiutare a semplificare il codice e mantenere un'esperienza interfaccia utente e utente coerente. Come parte del processo di postback, anche se, probabilmente si vorrà nascondere alcuni elementi della pagina; per esempio, si potrebbe desiderare di fare solo il <div> che contiene la forma stessa visibile per la prima volta, utilizzando il display postback della pagina per consentire all'utente di confermare il loro contributo prima di sottoporlo un'ultima volta. Per nascondere un div su postback, che verrà utilizzato JavaScript, analizzato da alcuni semplici PHP.

istruzione

1 Aprire il file PHP che contiene il modulo HTML e la gestione della metodologia postback codice. Scorrere verso il basso per il <div> che si desidera nascondere, e prendere nota di è "ID", o identificativo univoco (per esempio, "id = 'div_to_be_hidden'" segna un <div> con l'ID univoco di "div_to_be_hidden" ). Se il <div> attualmente non avere uno, aggiungere un attributo id al tag.

2 Copiare e incollare la seguente riga di codice come la prima riga nel file sorgente della pagina web, di non modificare in anticipo:

<? Php if (isset ($ _ POST [ "postback_check"])) {$ postbackhide = "<script type = \" text / javascript \ "> \ n document.getElementById ( '". $ _ POST [ "postback_check"]. " ') .style.display =' none '; \ n </ script>"; } Else {$ postbackhide = "";}>?

Questo codice PHP aggiunge un po 'di JavaScript che contestualmente verificare se la pagina è in modalità di visualizzazione o postback iniziale, e nascondere un determinato div in modo appropriato.

3 Spostare verso il basso nel documento per la forma attuale, segnata dalla "<form>" start e "</ form>" tag di chiusura. Aggiungere un elemento di input con il tipo "nascosto", il nome "postback_check" e un valore uguale al id del <div> che ti verrà nascosto. Ad esempio, se il <div> è stato chiamato "div_to_be_hidden," è necessario aggiungere il seguente input per il modulo:

<Input type = nome = valore "nascosto" "postback_check" = "element_to_hide">

4 Aggiungere una breve riga di codice JavaScript chiamando il creato nella funzione PHP sulla prima riga della pagina. Ti consigliamo di aggiungere questo immediatamente sotto il <div> si vuole nascondere, in modo che il codice verrà eseguito dopo il <div> viene caricato nella memoria della pagina. Copia e incolla questo codice, senza fare modifiche ad esso:

<? Php echo $ postbackhide; ?>

5 Salvare il documento e chiudere l'editor. Quando si carica il modulo, il <div> verrà visualizzato come normale; il postback, il campo nascosto "postback_check" attiverà il PHP inizializzazione, aggiungendo il codice JavaScript necessario per nascondere il <div>, utilizzando le proprietà "style.display" di JavaScript.