Buenos días a todos, necesito vuestra ayuda, estoy trabajando en wordpress, aunque mi duda es de Javascript.
Tengo una página donde tengo 2 bucles, que construyen 10 selects con diferentes opciones (equipos de futbol). Lo que quiero hacer es que cuando en el 1r select se seleccione un equipo, este no esté disponible en todos los demás selects...
De manera que vayan quedando cada vez menos equipos, cuando los vas seleccionando..
No se si me he explicado muy bien, pero pondré un pequeño ejemplo.
Si en el primer select, selecciono el Barcelona, este NO deberñia aparecer en las demás listas. Para llamar la función javascript, uso el Onclick y le paso el equipo (al menos en eso habia pensado).
Espero que me podais ayudar porque voy bastante perdido xD Gracias!.
Mis selects son los siguientes:
Código PHP:
Ver original<?php
echo "<form id='acMarc' name='acMarc'><table id='tablaActMarc'><th>";
for($i=0;$i<10;$i++){
echo "<select class='selects' id='selActMarcL' name='selL'>
<option selected='selected'>Seleccione Equipo</option>
<option id='Barcelona' value='Barcelona' onclick='javascript:quitarEquipo(1);'>Barcelona</option>
<option id='Madrid' value='Madrid' onclick='javascript:quitarEquipo(2);'>Madrid</option>
<option id='Valencia' value='Valencia' onclick='javascript:quitarEquipo(3);'>Valencia</option>
<option id='Malaga' value='Malaga' onclick='javascript:quitarEquipo(4);'>Malaga</option>
<option id='Levante' value='Levante' onclick='javascript:quitarEquipo(5);'>Levante</option>
<option id='Atletico' value='Atletico' onclick='javascript:quitarEquipo(6);'>Atletico</option>
<option id='Mallorca' value='Mallorca' onclick='javascript:quitarEquipo(7);'>Mallorca</option>
<option id='Athletic' value='Athletic' onclick='javascript:quitarEquipo(8);'>Athletic</option>
<option id='Osasuna' value='Osasuna' onclick='javascript:quitarEquipo(9);'>Osasuna</option>
<option id='Sevilla' value='Sevilla' onclick='javascript:quitarEquipo(10);'>Sevilla</option>
<option id='Betis' value='Betis' onclick='javascript:quitarEquipo(11);'>Betis</option>
<option id='Getafe' value='Getafe' onclick='javascript:quitarEquipo(12);'>Getafe</option>
<option id='Espanyol' value='Espanyol' onclick='javascript:quitarEquipo(13);'>Espanyol</option>
<option id='RealSociedad' value='RealSociedad' onclick='javascript:quitarEquipo(14);'>Real Sociedad</option>
<option id='Granada' value='Granada' onclick='javascript:quitarEquipo(15);'>Granada</option>
<option id='Villareal' value='Villareal' onclick='javascript:quitarEquipo(16);'>Villareal</option>
<option id='Rayo' value='Rayo' onclick='javascript:quitarEquipo(17);'>Rayo</option>
<option id='Zaragoza' value='Zaragoza' onclick='javascript:quitarEquipo(18);'>Zaragoza</option>
<option id='Sporting' value='Sporting' onclick='javascript:quitarEquipo(19);'>Sporting</option>
<option id='Racing' value='Racing' onclick='javascript:quitarEquipo(20);'>Racing</option>
</select><br>";
}
echo "</th><th>";
for($b=0;$b<10;$b++){
echo "<center><input type='text' id='Gol$b' class='gol'>-<input type='text' id='Gol$b+1' class='gol'><br></center>";
}
echo "</th><th>";
for($b=0;$b<10;$b++){
echo "<select class='selects' id='selActMarcR' name='selR$i'>
<option selected='selected'>Seleccione Equipo</option>
<option id='Barcelona' value='Barcelona' onclick='javascript:quitarEquipo(1);'>Barcelona</option>
<option id='Madrid' value='Madrid' onclick='javascript:quitarEquipo(2);'>Madrid</option>
<option id='Valencia' value='Valencia' onclick='javascript:quitarEquipo(3);'>Valencia</option>
<option id='Malaga' value='Malaga' onclick='javascript:quitarEquipo(4);'>Malaga</option>
<option id='Levante' value='Levante' onclick='javascript:quitarEquipo(5);'>Levante</option>
<option id='Atletico' value='Atletico' onclick='javascript:quitarEquipo(6);'>Atletico</option>
<option id='Mallorca' value='Mallorca' onclick='javascript:quitarEquipo(7);'>Mallorca</option>
<option id='Athletic' value='Athletic' onclick='javascript:quitarEquipo(8);'>Athletic</option>
<option id='Osasuna' value='Osasuna' onclick='javascript:quitarEquipo(9);'>Osasuna</option>
<option id='Sevilla' value='Sevilla' onclick='javascript:quitarEquipo(10);'>Sevilla</option>
<option id='Betis' value='Betis' onclick='javascript:quitarEquipo(11);'>Betis</option>
<option id='Getafe' value='Getafe' onclick='javascript:quitarEquipo(12);'>Getafe</option>
<option id='Espanyol' value='Espanyol' onclick='javascript:quitarEquipo(13);'>Espanyol</option>
<option id='RealSociedad' value='RealSociedad' onclick='javascript:quitarEquipo(14);'>Real Sociedad</option>
<option id='Granada' value='Granada' onclick='javascript:quitarEquipo(15);'>Granada</option>
<option id='Villareal' value='Villareal' onclick='javascript:quitarEquipo(16);'>Villareal</option>
<option id='Rayo' value='Rayo' onclick='javascript:quitarEquipo(17);'>Rayo</option>
<option id='Zaragoza' value='Zaragoza' onclick='javascript:quitarEquipo(18);'>Zaragoza</option>
<option id='Sporting' value='Sporting' onclick='javascript:quitarEquipo(19);'>Sporting</option>
<option id='Racing' value='Racing' onclick='javascript:quitarEquipo(20);'>Racing</option>
</select><br>";
}
echo "</th></table><center><input type='button' id='ActMarcadores;' value='Actualizar Marcadores' class='submitAnunciarse'></center></form>";
?>
y de Javascript tengo muy poco, por no decir casi nada.... Lo único que he estado haciendo pruebas y de la siguiente manera, me borra de la lista pero sólo de la que selecciono, no las del resto...
Código Javascript
:
Ver originalfunction quitarEquipo(equipo){
alert(equipo);
for(var c=0; c<10;c++){
document.getElementById('selActMarcL').remove(equipo);
}
document.getElementById('selActMarcR').remove(equipo);
}