5

Como dice el título, quisiera que al momento de seleccionar un valor, en este caso "Europeo" o "Americano", este muestre en los campos de "largo", "alto" y "ancho" un valor numérico.

Les doy el código:

var D = document.getElementById("D");
var P = document.getElementById("P");
var S = document.getElementById("S");

S.onclick = function() {
  document.getElementById('tipoenvio').style.display = "block";
}
P.onclick = function() {
  document.getElementById('tipoenvio').style.display = "none";
}
D.onclick = function() {
  document.getElementById('tipoenvio').style.display = "none";
}
<input type='radio' name='tipo-envio' value='D' tabindex="1" id="D" /><span> Docs</font></span>&nbsp
<input type='radio' name='tipo-envio' value='P' tabindex="1" id="P" checked="checked" /><span> Paquetes</span>&nbsp
<input type='radio' name='tipo-envio' value='S' tabindex="1" id="S" />
<span> Palé </span><br />
<div id="tipoenvio" style="display:none">
  <input type="radio" name="tipo-envio" id="1" value="P">
  <font color="black" size="1x">Europeo</font> &nbsp
  <input type="radio" name="tipo-envio" id="2" value="P">
  <font color="black" size="1x">Americano</font> &nbsp
  <input type="radio" name="tipo-envio" id="3" value="P">
  <font color="black" size="1x">Otros</font>
</div>


<span class="pl_bloq_titulo">Peso:</span>
<div class="bloq_cuadro">
  <input type="text" name="peso_1" id="peso_1" class="validar_imput" maxlength="6" autocomplete="off" tabindex="7" /><span class="form_label1">kg</span>
</div>

<span class="pl_bloq_titulo">Largo:</span>
<div class="bloq_cuadro">
  <input type="text" name="largo_1" id="largo_1" class="validar_imput" maxlength="6" autocomplete="off" tabindex="8" /><span class="form_label1">cm</span>
</div>

<span class="pl_bloq_titulo">Ancho:</span>
<div class="bloq_cuadro">
  <input type="text" name="ancho_1" id="ancho_1" class="validar_imput" maxlength="6" autocomplete="off" tabindex="9" /><span class="form_label1">cm</span>
</div>

<span class="pl_bloq_titulo">Alto:</span>
<div class="bloq_cuadro">
  <input type="text" name="alto_1" id="alto_1" class="validar_imput" maxlength="6" autocomplete="off" tabindex="10" /><span class="form_label1">cm</span>
</div>

2
  • Hola, lo que quieres que seleccionando en el radio se coloquen valores por defecto en tus inputs, ¿no es así? Commented el 17 may. 2018 a las 23:19
  • Si, eso deseo... Commented el 17 may. 2018 a las 23:22

1 respuesta 1

2

Puedes hacerlo con .value asi:

var D = document.getElementById("D");
var P = document.getElementById("P");
var S = document.getElementById("S");

S.onclick = function(){
        document.getElementById('tipoenvio').style.display="block";
        document.getElementById('largo_1').value = 1
        document.getElementById('ancho_1').value = 1
        document.getElementById('alto_1').value = 1
}
P.onclick = function(){
        document.getElementById('tipoenvio').style.display="none";
        document.getElementById('largo_1').value = 2
        document.getElementById('ancho_1').value = 2
        document.getElementById('alto_1').value = 2
}
D.onclick = function(){
        document.getElementById('tipoenvio').style.display="none";
        document.getElementById('largo_1').value = 3
        document.getElementById('ancho_1').value = 3
        document.getElementById('alto_1').value = 3
}
<input type='radio' name='tipo-envio' value='D' tabindex="1" id="D"/><span> Docs</font></span>&nbsp
<input type='radio' name='tipo-envio' value='P' tabindex="1" id="P" checked="checked"/><span> Paquetes</span>&nbsp
<input type='radio' name='tipo-envio' value='S' tabindex="1" id="S"/>
<span> Palé </span><br />
<div id="tipoenvio" style="display:none">
<input type="radio" name="tipo-envio" id="1" value="P" > <font color="black" size="1x">Europeo</font> &nbsp
<input type="radio" name="tipo-envio" id="2" value="P" > <font color="black" size="1x">Americano</font> &nbsp
<input type="radio" name="tipo-envio" id="3" value="P" > <font color="black" size="1x">Otros</font>
</div>


<span class="pl_bloq_titulo">Peso:</span>
<div class="bloq_cuadro">
<input type="text" name="peso_1" id="peso_1" class="validar_imput"  maxlength="6" autocomplete="off" tabindex="7"/><span class="form_label1">kg</span>
</div>

<span class="pl_bloq_titulo">Largo:</span>
<div class="bloq_cuadro">
<input type="text" name="largo_1" id="largo_1" class="validar_imput" maxlength="6" autocomplete="off" tabindex="8"/><span class="form_label1">cm</span>
</div>

<span class="pl_bloq_titulo">Ancho:</span>
<div class="bloq_cuadro">
<input type="text" name="ancho_1" id="ancho_1" class="validar_imput" maxlength="6" autocomplete="off" tabindex="9"/><span class="form_label1">cm</span>
</div>

<span class="pl_bloq_titulo">Alto:</span>
<div class="bloq_cuadro">
<input type="text" name="alto_1" id="alto_1" class="validar_imput" maxlength="6" autocomplete="off" tabindex="10"/><span class="form_label1">cm</span>
</div>

1
  • Muchas gracias ! Commented el 17 may. 2018 a las 23:32

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.