Form HTML checkbox
Form HTML checkbox postato il 02/11/2017 16:41:25 nel forum programmazione, open source e hosting
Buonasera, ho un problema, più di grafica che di programmazione, ho un form html al momento sto usando un select option, mi va bene perchè è compatto visto che ho molti dati da inserire, sono divisi in 10 gruppi tutti da una decina e più di dati, e deve essere possibile selezionarne più di uno, come in un checkbox, c'è un modo per rendere un select option multiselect?
02/11/2017 17:47:13
Ti suggerisco vivamente di usare checkbox se non vuoi usare jquery o js in generale.
02/11/2017 18:24:41 e modificato da de1980 il 02/11/2017 19:01:56
A me andrebbe bene usare il checkbox ma con più di 100 valori per il checkbox nella pagina è ingestibile, per di più questi 100 valori sono e devono restare raggruppati.Pensavo potrei secondo voi insere i vari valori del checkbox dentro a un menù, tipo menù a discesa verticale?
02/11/2017 21:37:38
ho trovato il <select multiple> che ti fa selezionare più di un'opzione, l'unica cosa scomoda è che per selezionarli bisogna tenere premuto il CTRL e è molt scomodo e non intuitivo, avete idea di come si può ovviare il problema del CTRL?
03/11/2017 21:33:49 e modificato da startrekfederation_staff il 03/11/2017 21:35:09
Anche noi abbiamo avuto questo problema qualche tempo fa: questo sembra fare al caso tuo: http://jsfiddle.net/xQqbR/1022/ ↗ (l'esempio è preso da https://stackoverflow.com/questions/8641729/how-to-avoid-the-need-for-ctrl-click-in-a-multi-select-box-using-javascript ↗)Enjoy!
06/11/2017 16:28:00
startrekfederation_staff ha scritto: Anche noi abbiamo avuto questo problema qualche tempo fa: questo sembra fare al caso tuo: http://jsfiddle.net/xQqbR/1022/ ↗ (l'esempio è preso da https://stackoverflow.com/questions/8641729/how-to-avoid-the-need-for-ctrl-click-in-a-multi-select-box-using-javascript ↗)Enjoy!
non mi apre il primo link mi da errore 404, il secondo è in inglese e speravo di trovare qualcosa in italiano per capire un po' meglio
06/11/2017 16:55:07
http://jsfiddle.net/xQqbR/1022/
06/11/2017 21:49:08 e modificato da de1980 il 07/11/2017 09:11:52
Non mi funziona puoi controllare il codice per favore:
<!DOCTYPE html><html><head><script type="text/javascript"> $('option').mousedown(function(e) { e.preventDefault(); var originalScrollTop = $(this).parent().scrollTop(); console.log(originalScrollTop); $(this).prop('selected', $(this).prop('selected') ? false : true); var self = this; $(this).parent().focus(); setTimeout(function() { $(self).parent().scrollTop(originalScrollTop); }, 0);</script> </head><body><?php echo"<form method='post' action='portate_menu.php'>"; echo"<select multiple='multiple' name='bevande'>"; echo"<option> Bevande </option>"; echo"</select>"; echo "<input type='submit' value='INVIA!'>"; echo"</form>";?>
06/11/2017 22:44:15
Devi verificare se la console ti restituisce errori o warningPer il resto, se vuoi aiuto (da chiunque), ti suggerisco di dare una pulita e indentare decentemente il codice, perché viene il mal di testa a leggerlo così.
07/11/2017 09:08:16
raysmoke ha scritto: Devi verificare se la console ti restituisce errori o warningPer il resto, se vuoi aiuto (da chiunque), ti suggerisco di dare una pulita e indentare decentemente il codice, perché viene il mal di testa a leggerlo così.
era anche peggio prima per quello l'ho modificato la parte sotto non sono riuscita ad indentarla ora riprovo, dalla pagina ho tolto tutto a parte quello di interesse, ora lo ricontrollo
07/11/2017 09:12:52 e modificato da de1980 il 07/11/2017 09:29:46
<!DOCTYPE html><html><head><script type="text/javascript"> $('option').mousedown(function(e) { e.preventDefault(); var originalScrollTop = $(this).parent().scrollTop(); console.log(originalScrollTop); $(this).prop('selected', $(this).prop('selected') ? false : true); var self = this; $(this).parent().focus(); setTimeout(function() { $(self).parent().scrollTop(originalScrollTop); }, 0);</script> </head><body><form method='post' action='portate_menu.php'> <select multiple='multiple' name='bevande'> <option> Bevande: </option> <option> Acqua </option> <option> Vino </option> <option> Caffè </option> </select> <input type='submit' value='INVIA!'></form>
Rispondi alla Discussione Segui Discussione Inoltra Discussione Forum Programmazione, Open Source e Hosting Elenco Forum
Articoli, Interviste e altre Risorse!
