Muy buenas, tengo un select en formato lista en el que los usuarios pueden seleccionar varios valores, y lo que quiero es que solo se puedan seleccionar tres opciones o menos.
Ya he conseguido que si seleccionan más de tres opciones salte un alert avisando de ello. Y en teoría he puesto que al enviar el formulario se vuelva a comprobar una vez más ese select, y que en caso de tener más de tres seleccionados, el formulario no se envíe, pero esto último no me lo hace. Si que me vuelve a sacar el alert, pero en lugar de hacer caso al return false; el formulario se envía de todas formas.
¿Qué tendría que cambiar para que una de dos, o haga caso y pare el envío del formulario, o cuando seleccione una cuarta opción, además de sacar el alert, anule esta última opción, dejando solo las tres primeras que se habían marcado?
Pongo todo el código tal cual lo tengo ahora:
Código Javascript
:
Ver original<head>
<script>
function validar_peligro()
{
var selectChoose = document.getElementById('peligro_secundario');
var maxOptions = 3;
var optionCount = 0;
for (var i = 0; i < selectChoose.length; i++) {
if (selectChoose[i].selected) {
optionCount++;
if (optionCount > maxOptions) {
alert("Solo puede seleccionar tres opciones o menos. Por favor, elimine las selecciones sobrantes.")
return false;
}
}
}
}
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="" onsubmit="validar_peligro()">
<select name="peligro_secundario" size="5" multiple="multiple" id="peligro_secundario" onchange="validate()">
<option value="" selected="selected">No aplica</option>
<option value="1">1</option>
<option value="2">3</option>
<option value="3">4.1</option>
<option value="4">4.2</option>
<option value="5">4.3</option>
<option value="6">5.1</option>
<option value="7">5.2</option>
<option value="8">6.1</option>
<option value="9">6.2</option>
<option value="10">8</option>
<option value="11">9</option>
</select>
--- varios campos más---
</form>
</body>