Form in struttura tabellare

boooooooooooo

Nuovo Utente
24 Lug 2012
8
0
0
Ciao a tutti,
ho bisogno di una struttura tabellare che recupera dei dati da un database e mi permette di modificare un campo per ogni riga restituita.
Es:
HTML:
<form action="#">
<table>
<tr>
<th>intestazione 1</th><th>intestazione 2</th><th>intestazione da modificare</th>
</tr>
<tr>

<td>risultato 1 intestazione 1</td><td><label for="res1">risultato 1 intestazione 2</label><input type="text" id="res1" /></td><td>risultato 1 intestazione 3</td>

<td>risultato 2 intestazione 1</td><td><label for="res2">risultato 2 intestazione 2</label><input type="text" id="res2" /></td><td>risultato 2 intestazione 3</td>


<td>risultato 3 intestazione 1</td><td><label for="res3">risultato 3 intestazione 2</label><input type="text" id="res3" /></td><td>risultato 3 intestazione 3</td>
</tr>
<input type="submit" value="Go" />
/table>
</form>
Volevo chiedere a voi tutti gentilissimi se il codice è corretto e accessibile.

Grazie a tutti
 
Ultima modifica di un moderatore:
Racchiudi i campi di input tra:
PHP:
<fieldset>...</fieldset>
Per il resto non vedo errori particolari, comunque verifica con l'apposito validatore per le porzioni di HTML.
 
Form in struttura tabellare senza label e th ridondante

Racchiudi i campi di input tra:
PHP:
<fieldset>...</fieldset>
Per il resto non vedo errori particolari, comunque verifica con l'apposito validatore per le porzioni di HTML.

Grazie per la risposta Eliox,
se io volessi avere:
HTML:
<td><input type="text"  /></td>
invece di:
HTML:
<td><label for="res1">risultato 1 intestazione 2</label><input type="text" id="res1" /></td>

visto che inserire una label dentro una cella che ha già ha un riferimento (th) mi sembra ridondante e poco significativo,
è possibile una soluzione diversa tipo una label vuota o altro.
Grazie ancora
 
La label aiuta il form ad essere più accessibile, in linea di massima la lascerei.
 
Label hidden

La label aiuta il form ad essere più accessibile, in linea di massima la lascerei.
Avendo a che fare con un portale di una PA, credo di doverla lasciare. Forse dandole una classe e da css renderla non visibile (visibility:hidden) potrebbe essere una soluzione per lo screen reader. Che ne dite?:confused:
 
ciao
potrebbe essere un'idea, però firse è meglio usare display:none; così non ti occupa spazio

HTML:
<style type="text/css">
.a{visibility:hidden;}
.b{display:none;}
</style>
<table>
<tr><td><label for="res1" class="a">risultato 1 intestazione 2</label><input type="text" id="res1" /></td></tr>
<tr><td><label for="res1" class="b">risultato 1 intestazione 2</label><input type="text" id="res1" /></td></tr>
</table>
 
ciao
potrebbe essere un'idea, però firse è meglio usare display:none; così non ti occupa spazio

HTML:
<style type="text/css">
.a{visibility:hidden;}
.b{display:none;}
</style>
<table>
<tr><td><label for="res1" class="a">risultato 1 intestazione 2</label><input type="text" id="res1" /></td></tr>
<tr><td><label for="res1" class="b">risultato 1 intestazione 2</label><input type="text" id="res1" /></td></tr>
</table>

Hai pienamente ragione!!
 
In alternativa si potrebbe usare qualcosa del genere:
PHP:
.hidden{
position: absolute;
left: -9999px;
top: -9999px;
visibility: hidden;
}
 
In alternativa si potrebbe usare qualcosa del genere:
PHP:
.hidden{
position: absolute;
left: -9999px;
top: -9999px;
visibility: hidden;
}

Questa è la tecnica utilizzata per la sostituzione delle immagini di sfondo.
E' un'idea a cui avevo pensato e con cui otterrei lo stesso risultato della soluzione proposta da "borgo", ma dovrei scrivere alcune regole in più. Il che non è un dramma, ma è sempre indicato scrivere meno codice sia per motivi di peso che di manutenibilità.
 

Discussioni simili