Foros del Web » Programando para Internet » Javascript »

Eliminar valores(option) iguales entre combobox

Estas en el tema de Eliminar valores(option) iguales entre combobox en el foro de Javascript en Foros del Web. Tengo dos combobox con 5 opciones iguales cada uno pues son comparativas, necesito que si elijo "option 1" en el combo1, se elimine "option 1" ...
  #1 (permalink)  
Antiguo 10/02/2011, 14:41
 
Fecha de Ingreso: octubre-2010
Mensajes: 136
Antigüedad: 13 años, 5 meses
Puntos: 4
Eliminar valores(option) iguales entre combobox

Tengo dos combobox con 5 opciones iguales cada uno pues son comparativas, necesito que si elijo "option 1" en el combo1, se elimine "option 1" en el combo2:
Código:
<select name="combo1" id="combo1">
    <option value="a" selected class="select">1</option>
    <option value="b" selected class="select">2</option>
    <option value="c" selected class="select">3</option>
    <option value="d" selected class="select">4</option>
    <option value="e" selected class="select">5</option>
    </select>
<select name="combo2" id="combo2">
    <option value="a" selected class="select">1</option>
    <option value="b" selected class="select">2</option>
    <option value="c" selected class="select">3</option>
    <option value="d" selected class="select">4</option>
    <option value="e" selected class="select">5</option>
    </select>
Osea si escojo la opcion 1 se me deshabilite la opcion 1 en el otro combo, o que se elimine...gracias de antemano
__________________
Ser o conocer ese es el dilema...
  #2 (permalink)  
Antiguo 10/02/2011, 14:53
 
Fecha de Ingreso: diciembre-2010
Mensajes: 788
Antigüedad: 13 años, 4 meses
Puntos: 51
Respuesta: Eliminar valores(option) iguales entre combobox

Te paso a ver si te sirve:

Código HTML:
Ver original
  1. <select name="combo1" id="combo1" onchange="borrarOptions(this.value)">
  2.     <option value="a" selected class="select">1</option>
  3.     <option value="b" selected class="select">2</option>
  4.     <option value="c" selected class="select">3</option>
  5.     <option value="d" selected class="select">4</option>
  6.     <option value="e" selected class="select">5</option>
  7.     </select>
  8. <select name="combo2" id="combo2">
  9.     <option value="a" selected class="select">1</option>
  10.     <option value="b" selected class="select">2</option>
  11.     <option value="c" selected class="select">3</option>
  12.     <option value="d" selected class="select">4</option>
  13.     <option value="e" selected class="select">5</option>
  14.     </select>

Código Javascript:
Ver original
  1. <script>
  2. function borrarOptions(valor) {
  3.  
  4.     var i=0;
  5.     var opciones = document.getElementById('combo2').options;
  6.     for(i=0;i<opciones.length;i++){
  7.         if(opciones[i].value == valor){
  8.             document.getElementById('combo2').remove(i);  
  9.         }
  10.     }        
  11. }
  12. </script>
  #3 (permalink)  
Antiguo 10/02/2011, 15:20
 
Fecha de Ingreso: octubre-2010
Mensajes: 136
Antigüedad: 13 años, 5 meses
Puntos: 4
Respuesta: Eliminar valores(option) iguales entre combobox

Casi casi es mi punto...solo que lo que pasa en la funcion que me diste es que elimina la opcion cada vez que sucede un cambio en el combo1, entoces si doy clic desde 5, 4, 3, 2, 1, me queda sin una sola opcion en el combo2...
Talvez si se puede poner disabled la opcion en el combo2 cuando se eligen opciones iguales en el los 2 combos...o no se...
El fin de todo esto es que no se pueda elegir en el combo1 la opcion 1 y en el combo2 la opcion1...osea 2 selecciones iguales en los 2 combos...
Código:
<select name="combo1" id="combo1" onchange="borrarOptions(this.value)">
    <option value="a" selected  class="select">Vacaciones</option>
    <option value="b" selected class="select">Carro</option>
    <option value="c" selected class="select">Casa</option>
    <option value="d" selected class="select">Moto</option>
    <option value="e" selected class="select">Avion</option>
    </select>
<select name="combo2" id="combo2">
   <option value="a" selected  class="select">Vacaciones</option>
    <option value="b" selected class="select">Carro</option>
    <option value="c" selected class="select">Casa</option>
    <option value="d" selected class="select">Moto</option>
    <option value="e" selected class="select">Avion</option>
    </select>
Talvez así se me entienda mejor, si elijo Carro en combo1 no pueda hacerlo en combo2...Gracias por su tiempo
__________________
Ser o conocer ese es el dilema...
  #4 (permalink)  
Antiguo 10/02/2011, 15:28
 
Fecha de Ingreso: diciembre-2010
Mensajes: 788
Antigüedad: 13 años, 4 meses
Puntos: 51
Respuesta: Eliminar valores(option) iguales entre combobox

Entiendo, pero no existe una propiedad para eso. Todo depende para que sirva tu código, en que se implementa.
  #5 (permalink)  
Antiguo 10/02/2011, 15:38
Avatar de Adler
Colaborador
 
Fecha de Ingreso: diciembre-2006
Mensajes: 4.671
Antigüedad: 17 años, 3 meses
Puntos: 126
Respuesta: Eliminar valores(option) iguales entre combobox

Hola

Prueba con esto
Código Javascript:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta name="http-equiv" content="Content-type: text/html; charset=UTF-8"/>
  5. <script type="text/javascript">
  6. function getElement(elElemento) {
  7. return document.getElementById(elElemento);
  8. }
  9.  
  10.  
  11. var vuelta = 0;
  12. var ok = '';
  13. var eliminadosVal = new Array();  
  14. function delOpcion(val) {
  15. var valores = new Array();
  16. var count = 1;
  17. eliminados = 0;
  18.  
  19. if (val.id == ok && vuelta >= 1) {alert('Antes de elegir otra opción de este select, has de restablecer la última opción'); val.options[0].selected = 'selected'; return;}
  20.  
  21. var combo = val.name;
  22. var f = document.form1;
  23.  
  24. for (var i = 0; val.options[i]; i++) {
  25.  
  26.     if (i == val.selectedIndex) {
  27.  
  28.         for (var n = 0, sel = f[combo].length; n < sel; n++) {
  29.  
  30.             if (val.id != f[combo][n].id) {
  31.  
  32.                 for (var p = 0; f[combo][n].options[p]; p++) {
  33.  
  34.                     if (val.value == f[combo][n].options[p].value) {
  35.  
  36.                         eliminados++;
  37.                         valores.push(new Array(val.value,p,f[combo][n].id,val,eliminados));
  38.                             if (count == 1) {
  39.                                 eliminadosVal.push(new Array(valores));
  40.                             }                      
  41.                         getElement(f[combo][n].id).options[p] = null;
  42.                         count++;
  43.                         vuelta ++;
  44. break;
  45.                     }
  46.  
  47.                 }
  48.  
  49.             }
  50.  
  51.         }
  52. break;
  53.  
  54.     }
  55.  
  56. }
  57.  
  58. ok = val.id;
  59.  
  60. var lista_elementos = '';
  61.     for (var i = 0; i < eliminadosVal.length; i++) {
  62.         for (var p = 0; p < eliminadosVal[i].length; p++) {
  63.             lista_elementos += '<li>' + eliminadosVal[i][p][0][0] + ' <a class="restaurar" href="#" onclick="Redo('+i+');return false;">x</a></li>';
  64.         }
  65.     }
  66.  
  67. getElement('listaEliminados').innerHTML =  lista_elementos;
  68. }
  69.  
  70.  
  71.  
  72.  
  73.  
  74.  
  75.  
  76.  
  77.  
  78. function Redo(arr) {
  79. vuelta = 0;
  80. var lista_elementos = '';
  81. for (var i = 0; i < eliminadosVal[arr].length; i++) {
  82.  
  83.     for (var p = 0; p < eliminadosVal[arr][i].length; p++) {
  84.  
  85.         var reDoOpciones = new Option(eliminadosVal[arr][i][p][0], eliminadosVal[arr][i][p][0]);
  86.  
  87.         if (getElement(eliminadosVal[arr][i][p][2]).options.length == eliminadosVal[arr][i][p][1]) { // Si es la última opción
  88.            
  89.             eval(getElement(eliminadosVal[arr][i][p][2]).options[eliminadosVal[arr][i][p][1]] = reDoOpciones);
  90.  
  91.         } else {
  92.  
  93.             opt = getElement(eliminadosVal[arr][i][p][2]).options.length;
  94.  
  95.             for (var n = getElement(eliminadosVal[arr][i][p][2]).options.length-1; n >= eliminadosVal[arr][i][p][1];  n--) {
  96.  
  97.            
  98.                 var reInsertaOpt = new Option(getElement(eliminadosVal[arr][i][p][2]).options[n].text, getElement(eliminadosVal[arr][i][p][2]).options[n].value);  
  99.                 eval(getElement(eliminadosVal[arr][i][p][2]).options[opt] = reInsertaOpt);
  100.             opt--;
  101.             }
  102.  
  103.                 eval(getElement(eliminadosVal[arr][i][p][2]).options[eliminadosVal[arr][i][p][1]] = reDoOpciones);
  104.         }
  105.  
  106.         eliminadosVal[arr][i][p][3].options[0].selected = 'selected'; // Seleccionamos la primera opción de los select en los que ya ha sido selecciona una opción repetida en otro select
  107.        
  108.  
  109.     }
  110. eliminadosVal[arr].pop();
  111. }
  112.  
  113.  
  114.  
  115. for (var i = 0; i < eliminadosVal.length; i++) {
  116.     for (var p = 0; p < eliminadosVal[i].length; p++) {
  117.         lista_elementos += '<li>' + eliminadosVal[i][p][0][0] + ' <a class="restaurar" href="#" onclick="Redo('+i+');return false;">x</a></li>';
  118.     }
  119. }
  120.  
  121. getElement('listaEliminados').innerHTML =  lista_elementos;
  122. }
  123. </script>
  124. </head>
  125. <body>
  126. Si la opci&oacute;n seleccionada, est&aacute; en los siguientes combos, se eliminar&aacute;<br />
  127. <form id="form1" name="form1" method="post" action="">
  128. <select id="regalo_1" name="regalo[]" size="10" onchange="delOpcion(this)">
  129. <option value="">Regalo para Ti</option>
  130. <option value="Moto">Moto</option>
  131. <option value="Coche">Coche</option>
  132. <option value="Barco">Barco</option>
  133. <option value="Bicicleta">Bicicleta</option>
  134. </select>
  135.  
  136. <select id="regalo_2" name="regalo[]" size="10" onchange="delOpcion(this)">
  137. <option value="">Regalo para Padres</option>
  138. <option value="Coche">Coche</option>
  139. <option value="Casa">Casa</option>
  140. <option value="Viaje">Viaje</option>
  141. <option value="Moto">Moto</option>
  142. </select>
  143.  
  144. <select id="regalo_3" name="regalo[]" size="10" onchange="delOpcion(this)">
  145. <option value="">Regalo para Hermanos</option>
  146. <option value="Consola">Consola</option>
  147. <option value="Bicicleta">Bicicleta</option>
  148. <option value="Moto">Moto</option>
  149. <option value="Mp4">Mp4</option>
  150. </select>
  151. </form>
  152.  
  153. <ul id="listaEliminados"></ul>
  154. </body>
  155. </html>
Suerte
__________________
Los formularios se envían/validan con un botón Submit
<input type="submit" value="Enviar" style="background-color:#0B5795; font:bold 10px verdana; color:#FFF;" />
  #6 (permalink)  
Antiguo 10/02/2011, 17:48
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.050
Antigüedad: 15 años
Puntos: 1485
Respuesta: Eliminar valores(option) iguales entre combobox

no es por nada pero como que conozco ese codigo, http://www.forosdelweb.com/showthread.php?t=851780
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.
  #7 (permalink)  
Antiguo 10/02/2011, 17:49
 
Fecha de Ingreso: diciembre-2010
Mensajes: 788
Antigüedad: 13 años, 4 meses
Puntos: 51
Respuesta: Eliminar valores(option) iguales entre combobox

Cita:
Iniciado por zerokilled Ver Mensaje
no es por nada pero como que conozco ese codigo, http://www.forosdelweb.com/showthread.php?t=851780
Violación de las leyes de copyright!!! XD
  #8 (permalink)  
Antiguo 11/02/2011, 16:06
Avatar de Adler
Colaborador
 
Fecha de Ingreso: diciembre-2006
Mensajes: 4.671
Antigüedad: 17 años, 3 meses
Puntos: 126
Respuesta: Eliminar valores(option) iguales entre combobox

Cita:
Iniciado por zerokilled Ver Mensaje
no es por nada pero como que conozco ese codigo, http://www.forosdelweb.com/showthread.php?t=851780
con lo bien que me había quedado bueno, seguro que a @isabelM no le importa. Como no seguí el tema, ahora me he visto forzado a copiar el tuyo esto ya es puro vicio
__________________
Los formularios se envían/validan con un botón Submit
<input type="submit" value="Enviar" style="background-color:#0B5795; font:bold 10px verdana; color:#FFF;" />
  #9 (permalink)  
Antiguo 11/02/2011, 16:32
 
Fecha de Ingreso: octubre-2010
Mensajes: 136
Antigüedad: 13 años, 5 meses
Puntos: 4
Exclamación Respuesta: Eliminar valores(option) iguales entre combobox

De hecho ya lo hacia de una forma anteriormente, con javascript, que me creaba los objetos del combo2 apartir de la opcion escogida en el combo1, funciona perfectamente, pero ahora estoy implementando cookies para mantener la ultima selección con que se trabajo, pero los cookies no me guardan el combo2 porque en realidad se crea a partir del primero...
Este es el código que use...
Código:
/***********************************************
* Create combo2
***********************************************/
var sedb = new Object()
sedb["http://www.gg.com/search?q="] = [{value:"http://search.yy.com/search?p=", text:"YY"},
                      {value:"http://search.aa.com/search?&q=", text:"AA"},
                      {value:"http://www.bb.com/search?q=", text:"BB"},
                      {value:"http://www.kk.com/web?q=", text:"KK"}];
sedb["http://search.yy.com/search?p="] = [{value:"http://www.gg.com/search?q=", text:"GG"},
                    {value:"http://search.aa.com/search?&q=", text:"AA"},
                    {value:"http://www.bb.com/search?q=", text:"BB"},
                    {value:"http://www.kk.com/web?q=", text:"KK"}];
sedb["http://search.aa.com/search?&q="] = [{value:"http://www.gg.com/search?q=", text:"GG"},
                    {value:"http://search.yy.com/search?p=", text:"YY"},
                    {value:"http://www.bb.com/search?q=", text:"BB"},
                    {value:"http://www.Kk.com/web?q=", text:"KK"}];
sedb["http://www.bb.com/search?q="] = [{value:"http://www.gg.com/search?q=", text:"GG"},
                    {value:"http://search.yy.com/search?p=", text:"YY"},
                    {value:"http://search.aa.com/search?&q=", text:"AA"},
                    {value:"http://www.kk.com/web?q=", text:"KK"}];
sedb["http://www.kk.com/web?q="] = [{value:"http://www.gg.com/search?q=", text:"GG"},
                    {value:"http://search.yy.com/search?p=", text:"YY"},
                    {value:"http://search.aa.com/search?&q=", text:"AA"},
                    {value:"http://www.bb.com/search?q=", text:"BB"}],

function setEngines(chooser) {
    var newElem;
    var where = (navigator.appName == "Microsoft Internet Explorer") ? -1 : null;
    var combo2Chooser = chooser.form.elements["combo2"];
    while (combo2Chooser.options.length) {
        combo2Chooser.remove(0);
    }
    var choice = chooser.options[chooser.selectedIndex].value;
    var db = sedb[choice];
    newElem = document.createElement("option");
    newElem.text = "Choose:";
    newElem.value = "";
    combo2Chooser.add(newElem, where);
    if (choice != "") {
        for (var i = 0; i < db.length; i++) {
            newElem = document.createElement("option");
            newElem.text = db[i].text;
            newElem.value = db[i].value;
            combo2Chooser.add(newElem, where);
        }
    }
}
Código:
<!--Combos -->
    <select name="combo1" onChange="combo2.selectedIndex=0;document.formulario.combo2.focus();" id="combo1">
    <option value="http://www.gg.com/search?q=" selected class="select">GG</option>
    <option value="http://search.yy.com/search?p=">YY</option>
    <option value="value:"http://search.aa.com/search?&q="">AA</option>
    <option value="http://www.bb.com/search?q=">BB</option>
    <option value="http://www.aa.com/web?q=">KK</option>
    </select>&nbsp;&amp;
<select name="combo2" id="combo2">
    <option value="" >Choose:</option>
</select>
Talvez le sirva a alguien por acá...
Pero ya me es inservible...lo que quisiera lograr es que si escojo la opcion1 en el combo1 la opcion1 del combo2 se ponga disabled o algo así...me entienden porque? evitar elegir ambas opciones iguales...ya que son comparativas...
__________________
Ser o conocer ese es el dilema...

Última edición por CWeeD; 11/02/2011 a las 16:42
  #10 (permalink)  
Antiguo 13/02/2011, 09:34
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: Eliminar valores(option) iguales entre combobox

Cita:
Iniciado por Adler Ver Mensaje
con lo bien que me había quedado bueno, seguro que a @isabelM no le importa. Como no seguí el tema, ahora me he visto forzado a copiar el tuyo esto ya es puro vicio
por qué me iba a importar?? el primer código me lo cedistes amablemente

Etiquetas: combobox, eliminar, iguales
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:52.