Tabs e panel caricati al volo

[Valeria75_bis]

Spero di non essere OT in quanto forse l'argomento è legato anche a Javascript cmq...

ho un form molto comlesso composto da molti campi, avevo quindi pensato di dividere i campi per argomenti organizzandoli in tabs ... e all'interno di ogni tabs, creare dei panel (collapsible panels) in stato hide/show

vorrei però fare in modo che per ogni show vengano fillati i campi .... e non in fase di caricamento ... questo per evitare che i campi della pagina vengano caricati completamente

l'ideale sarebbe quindi:
- se seleziono/accedo ad un tab: carico e visualizzo i campi del tab
- se visualizzo un panel (cliccando su pulsante "+" ... o cmq sull'evento "show") carico i campi

Secondo voi è fattibile??? E soprattutto è corretto questo approccio... per evitare di appesantire il caricamento con campi non sempre utili??? esistono degli esempi a riguardo??

Grazie infinite a tutti!!!

[MaxArt]

Ma come vorresti riempire i vari box? Ti fai passare tramite AJAX il contenuto HTML che andranno a riempire? O crei dinamicamente i campi in base a delle informazioni passate (sempre tramite AJAX)?
Vuoi usare AJAX, spero?

Comunque... boh, secondo me non ha molto senso. Hai ristrettezze di banda, per caso? Questo è proprio lesinare sui byte, ha senso solo se è un'operazione fatta di frequente.

[Valeria75_bis]

Grazie per la risposta!!

Non è un problema di banda, quando che riempire 100 campi e 5 tabelle mi sembra un po' eccessivo (pesante) per una singola pagina..... ed io devo tenere queste info in un'unica pagina..... per questo avevo ipotizzato questa soluzione. Dici che non ha senso?

Altre idee??

[MaxArt]

La tua idea di far fare all'utente "un pezzo alla volta" è buona e aumenta l'usabilità del sito; certo è che, comunque, dovrà fare tutti i campi.

Puoi fare così: la pagina la carichi con tutti i campi, ben divisi in sezioni, ma mostri soltanto una sezione per volta. O meglio, tieni inizialmente aperta solo la prima, e poi lasci facoltà all'utente di aprire le successive e chiudere le precedenti.

Se vuoi, puoi implementare un controllo che impedisca di aprire, che so, la sezione 3 se non è stata completata la 2. A tua discrezione.

[Valeria75_bis]

la pagina la carichi con tutti i campi, ben divisi in sezioni,

quindi appesantirei cmq la pagina per via dell'accesso a tutti i dati

la tua soluzione è solo per migliorare l'usabilità ..... non le prestazioni, corretto??

Grazie

[L-04]

ma stiamo parlando pursempre di un file di testo, l'utente aspetterà un po piu di tempo all'inizio per poi poter compilare tutti i campi in un colpo, non sarà mai talmente pesante da rallentare gravemente la pagina, io ho fatto pagine da migliaia di righe, si caricavano in 5/6 secondi piu del normale e poi con document.getElementById("idelemento").style.displa y = "none"; e document.getElementById("idelemento").style.displa y = "block"; mi gestivo gli elementi, era molto piu comodo, fidati;
anzi proprio perchè i contenuti sono tanti conviene far aspettare all'utente un po piu di tempo all'inizio per poi dargli la possibilità di compilare tutto tranquallamente anche in caso di cadute di linea, e non ci saranno errori in caso di server momentaneamente irraggingibile

[MaxArt]

Originariamente inviato da Valeria75_bis
quindi appesantirei cmq la pagina per via dell'accesso a tutti i dati

la tua soluzione è solo per migliorare l'usabilità ..... non le prestazioni, corretto??

Giusto, ma vale quel che ha detto L-04
Se vuoi fa' dei test, ma vedrai che se si tratta di un centinaio di campi alla fine manderai - quanto? - 10 kB di dati in più...
Non siamo più negli anni '90, per fortuna bene o male abbiamo un po' tutti la banda "larga"... A meno che non parli di un sito per smartphone e collegamenti 3G

[L-04]

ed anche li 10/15 secondi di attesa non sono la fine del mondo

[Valeria75_bis]

Ciao a tutti, grazie per i suggerimenti.... effettivamente la pagina dovrebbe essere compilata anche da iPad/Galaxy e simili... cmq mi avete convinta

quando fate riferimento a

document.getElementById("idelemento").style.display = "none"; 
document.getElementById("idelemento").style.display = "block";

perchè tornerebbe utile questa applicazione?

Grazie

[L-04]

perchè se tu vuoi fare in modo che alcuni form compaiano e scompaiano a seconda dei checkbox che si selezionano, quelle saranno il nodo principale delle funzioni javascript che ti serviranno, metti l'id dell'elemento e lo puoi nascondere o mostrare, poi ti suggerisco di andarti a vedere la differenza tra visibility e display, non mi ricordo bene, ma una rende semplicemente invisibile il box, mentre l'altra lo fa letteralmente ignorare all'interprete html, se ti servisse aiuto contattami o quà o all'email eclipse@frozenbox.tk che ti posso creare delle funzioni facili da usare x fare tutto il lavoro sporco

il mio sito è pieno zeppo di codice del genere quindi una funzione mostra("id"); e nascondi("id"); o anche verificaBox("id"); potrebbero tornare sempre utili.

a presto