Foros del Web » Programando para Internet » Javascript »

Duplicar o clonar un Select Option

Estas en el tema de Duplicar o clonar un Select Option en el foro de Javascript en Foros del Web. Hola a todos, tengo un proyecto, tengo un pequeño impase, Resulta que necesito escoger un numero de una serie de números del 1 al 20 ...
  #1 (permalink)  
Antiguo 02/06/2024, 11:14
 
Fecha de Ingreso: octubre-2008
Ubicación: Colombia
Mensajes: 450
Antigüedad: 16 años, 1 mes
Puntos: 2
Duplicar o clonar un Select Option

Hola a todos, tengo un proyecto, tengo un pequeño impase, Resulta que necesito escoger un numero de una serie de números del 1 al 20 en un select opction de un formulario, pero necesito que en otro Select option también se escoja el mismo número. Mi pregunta es obvia, cómo hago esto, se hace con JavaScript o hay otra forma?

Esto es lo que tengo, Este es el primer select

Código HTML:
Ver original
  1. <div class="form-group row">
  2.                                                    
  3.                                                         <span class="input-group-addon" id="basic-addon1">Horas trabajadas&nbsp;&nbsp;<img src="btn/marcador.png" width="18px">&nbsp;*</span>
  4.                                                         <div class="col-sm-9">
  5.                                                                                                        
  6.                                                             <select name="cant_horas" class="form-control" onChange="multiplicar();"  id="txt1" onkeyup="sum();" required>
  7.                                                                 <option value="opt1">Seleccione</option>
  8.                                                                 <option value="1">1</option>
  9.                                                                 <option value="2">2</option>
  10.                                                                 <option value="3">3</option>
  11.                                                                 <option value="4">4</option>
  12.                                                                 <option value="5">5</option>
  13.                                                                 <option value="6">6</option>
  14.                                                                 <option value="7">7</option>
  15.                                                                 <option value="8">8</option>
  16.                                                                 <option value="9">9</option>
  17.                                                                 <option value="10">10</option>
  18.                                                                 <option value="11">11</option>
  19.                                                                 <option value="12">12</option>
  20.                                                                 <option value="13">13</option>
  21.                                                                 <option value="14">14</option>
  22.                                                                 <option value="15">15</option>
  23.                                                                 <option value="16">16</option>
  24.                                                                 <option value="17">17</option>
  25.                                                                 <option value="18">18</option>
  26.                                                                 <option value="19">19</option>
  27.                                                                 <option value="20">20</option>
  28.  
  29.                                                             </select>
  30.                                                            
  31.                                                         </div>
  32.                                                     </div>

y quiero que al escoger cualquiera de los numero, automaticamente se escoja en el otro select. Es decir en este:

Código HTML:
Ver original
  1. <div class="form-group row">
  2.                                                    
  3.                                                         <span class="input-group-addon" id="basic-addon1">Horas trabajadas&nbsp;&nbsp;<img src="btn/marcador.png" width="18px">&nbsp;*</span>
  4.                                                         <div class="col-sm-9">
  5.                                                                                                        
  6.                                                             <select name="horas_contratadas_clientes" class="form-control" oninput="calculate()" id="copiar" onkeyup="sum();" required>
  7.                                                                 <option value="opt1">Seleccione</option>
  8.                                                                 <option value="1">1</option>
  9.                                                                 <option value="2">2</option>
  10.                                                                 <option value="3">3</option>
  11.                                                                 <option value="4">4</option>
  12.                                                                 <option value="5">5</option>
  13.                                                                 <option value="6">6</option>
  14.                                                                 <option value="7">7</option>
  15.                                                                 <option value="8">8</option>
  16.                                                                 <option value="9">9</option>
  17.                                                                 <option value="10">10</option>
  18.                                                                 <option value="11">11</option>
  19.                                                                 <option value="12">12</option>
  20.                                                                 <option value="13">13</option>
  21.                                                                 <option value="14">14</option>
  22.                                                                 <option value="15">15</option>
  23.                                                                 <option value="16">16</option>
  24.                                                                 <option value="17">17</option>
  25.                                                                 <option value="18">18</option>
  26.                                                                 <option value="19">19</option>
  27.                                                                 <option value="20">20</option>
  28.  
  29.                                                             </select>
  30.                                                            
  31.                                                         </div>
  32.                                                     </div>




Les agradezco sus valiosas respuestas. Bendiciones
__________________
Desarrollo de Aplicaciones de Escritorio, Sitios Web, Audio y Video en SISGUS

Última edición por karenlorenadg; 02/06/2024 a las 11:39
  #2 (permalink)  
Antiguo 03/06/2024, 08:40
Avatar de petit89  
Fecha de Ingreso: marzo-2011
Mensajes: 1.139
Antigüedad: 13 años, 8 meses
Puntos: 171
Respuesta: Duplicar o clonar un Select Option

Te he realizado este ejemplo muy sencillo para que lo adaptes...

https://jsfiddle.net/kdc4qnua/
__________________
█ WebHosting / Reseller a bajo costo | Uptime Garantizado | Soporte en Español e Ingles
¿Te sirvió la respuesta? Deja un +1 (Triangulo negro al lado derecho)
  #3 (permalink)  
Antiguo 03/06/2024, 11:01
 
Fecha de Ingreso: octubre-2008
Ubicación: Colombia
Mensajes: 450
Antigüedad: 16 años, 1 mes
Puntos: 2
Respuesta: Duplicar o clonar un Select Option

Hola amigo, lo probé tal cual me dices y funciona, pero al aplicarlo a mi formulario no me carga y es porque ya tengo otra función a ese formulario, si miras ahi tengo otro onChange="multiplicar();" que lo que hace es multiplicar los valores de dos campos, entonces al hacerlo con lo que me envías no me carga. QUé puedo hacer en este caso?
__________________
Desarrollo de Aplicaciones de Escritorio, Sitios Web, Audio y Video en SISGUS
  #4 (permalink)  
Antiguo 04/06/2024, 00:24
Avatar de petit89  
Fecha de Ingreso: marzo-2011
Mensajes: 1.139
Antigüedad: 13 años, 8 meses
Puntos: 171
Respuesta: Duplicar o clonar un Select Option

llamas las 2 funciones... he realizado el ejemplo con tu codigo, revisalo:
https://jsfiddle.net/eu85swft/
__________________
█ WebHosting / Reseller a bajo costo | Uptime Garantizado | Soporte en Español e Ingles
¿Te sirvió la respuesta? Deja un +1 (Triangulo negro al lado derecho)



La zona horaria es GMT -6. Ahora son las 01:18.