0

estoy teniendo problemas con esta página web. En un formulario en HTML, al momento de hacer clic en el input radio de "Memoria RAM" o "Procesador", el resultado se muestra en los dos input. ¿De qué manera puedo hacer independiente cada input text? De manera que cada uno muestre su valor en su respectivo input text, espero me puedan ayudar, gracias!

$("input").change(function(){

$("#rInput, #rInput2").val($("input:checked").val());

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="form">
    

  	<fieldset>

<h3>Memoria RAM</h3>
    <input type="radio" name="memoria" id="memoria" value="500" />4GB<br />
    <input type="radio" name="memoria" id="memoria" value="900" />8GB<br />
    <input type="radio" name="memoria" id="memoria" value="1800" />16GB<br />

<div id="resultado"><input id="rInput" type="text"></div>

</fieldset>

<fieldset>

    <h3> Micro Procesador</h3>

    <input type="radio" name="procesador" value="1000" />i3<br />
    <input type="radio" name="procesador" value="2500" />i5<br />
    <input type="radio" name="procesador" value="6000" />i7<br />

    <div id="resultado2"><input id="rInput" type="text"></div>

  </fieldset>

  </form>

1 respuesta 1

1

$("input").change(function(){

$("#rInput").val($("input:radio[name=memoria]:checked").val());
$("#rInput2").val($("input:radio[name=procesador]:checked").val());

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="form">
    

  	<fieldset>

<h3>Memoria RAM</h3>
    <input type="radio" name="memoria" id="memoria" value="500" />4GB<br />
    <input type="radio" name="memoria" id="memoria" value="900" />8GB<br />
    <input type="radio" name="memoria" id="memoria" value="1800" />16GB<br />

<div id="resultado"><input id="rInput" type="text"></div>

</fieldset>

<fieldset>

    <h3> Micro Procesador</h3>

    <input type="radio" name="procesador" value="1000" />i3<br />
    <input type="radio" name="procesador" value="2500" />i5<br />
    <input type="radio" name="procesador" value="6000" />i7<br />

    <div id="resultado2"><input id="rInput2" type="text"></div>

  </fieldset>

  </form>

Solo es cuestion de dividir los eventos dado el nombre del radio

4
  • Funciona de maravilla, muchas gracias! Me surgió una duda, de qué manera puedo dejar seleccionado por default uno de estos input radio? Ya intenté colocando "checked" dentro del input pero no me funciona, te agradecería muchísimo si podrías ayudarme @ivan hernandez aguilar
    – Chris
    Commented el 2 jun. 2020 a las 23:19
  • Es raro eso que comentas por que si se hace con checked de hecho deberia quedar algo asi <input type="radio" name="memoria" id="memoria" value="500" checked>4GB<br/> Commented el 2 jun. 2020 a las 23:23
  • Ya vi mi error, lo estaba poniendo dentro del value, gracias! Ya se queda seleccionado el input radio, sin embargo el valor no se muestra por defecto. Esto se soluciona pero con Jquery verdad?
    – Chris
    Commented el 2 jun. 2020 a las 23:40
  • Si, o bien puedes dejar tu input text con el valor por defecto, ambos son aceptados Commented el 2 jun. 2020 a las 23:42

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.