Estoy usando Bootstrap para el diseño de cuadrícula fácil y su estética agradable. Tengo archivos JavaScript para crear clases. Mi única página en este momento es index.html con un index.js.
Tengo un botón de enviar, y ese botón necesita tomar los valores de mis cuadros y crear un nuevo objeto con él, y no tengo idea de cómo continuar desde aquí.
¿Qué hago ahora? En realidad quiero hacer esto:
El JavaScript cuando acaba de ejecutarse en la consola funciona. El problema para mí es la entrega :)
¡Si alguien pudiera indicarme la dirección correcta, se lo agradecería!
<head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> <title>Test Site</title> <link rel="stylesheet" href="css/index.css"> <script type="module" src="js/index.js"></script> </head> <body> <div class="col-md-4" style="text-align: left;"> <form> <div class="form-group"> <label for="colFormLabel" class="col-sm-12 col-form-label col-form-label">Enter Text here</label> <div class="col-sm-12"> <input type="text" class="form-control form-control-sm" name="name1" placeholder="Enter your Name"> </div> </div> </form> </div> <div class="col-md-12" style="text-align: center;"> <button type="button" class="btn btn-primary" onclick=""> Confirm <span class="badge badge-light"></span> </button> </div> </body>Tienes que poner un type="submit" a tu formulario https://developer.mozilla.org/fr/docs/Web/HTML/Element/Input/submit
Luego puede agregar un evento onclick. Un buen ejemplo aquí: https://stackoverflow.com/a/12944957/10518580
En su JavaScript, cree una función llamada submitForm() y cambie el atributo onclick de su botón a submitForm() .
<button type="button" class="btn btn-primary" onclick="submitForm()"> Confirm <span class="badge badge-light"></span> </button>Esto le permite llamar a la función cuando se presiona el botón.
Para obtener valores de los diversos elementos de entrada, deberá proporcionarles ID. Por ejemplo, podrías tener
<input type="text" class="form-control form-control-sm" name="name1" id="name1" placeholder="Enter your Name">Luego accedería al valor de esta entrada llamando
document.GetElementById("name1").value dentro de su función submitForm() , o en cualquier otro lugar.