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?
Imperion ↗
02/11/2017 17:47:13
Ti suggerisco vivamente di usare checkbox se non vuoi usare jquery o js in generale.
World of Tanks ↗
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?
Crossout ↗
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?
Wuthering Waves ↗
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!
Cafuné ↗
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
Neverness to Everness ↗
06/11/2017 16:55:07
http://jsfiddle.net/xQqbR/1022/
RAID Shadow Legends ↗
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 warning
Per 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ì.
World of the Sea Battle ↗
07/11/2017 09:08:16
raysmoke ha scritto: Devi verificare se la console ti restituisce errori o warning
Per 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
Fallen Gods ↗
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>
Raja Dunia ↗
Rispondi alla Discussione Segui Discussione Inoltra Discussione Forum Programmazione, Open Source e Hosting Elenco Forum
Articoli, Interviste e altre Risorse!
