Skip to main content
2 de 2
cuerpo editado

Como capturar los datos de un formulario y mostrarlo en un html con JavaScript

Tengo el siguiente formulario al cual mediante una función me gustaria pasarle los datos a otro html. pero al hacerlo recibe todos los datos en null. ...................................................................................................................................................................................................................................................................................

function Generar() {
    let parms = new URLSearchParams(new FormData(ElForm)).toString();
    location.href = 'firma.html?' + parms; //<<descomentar esto
    console.log(parms);
    alert(parms)
 }
<html>
  <head>
    <script type="text/javascript" src="logica.js"></script>
  </head>
<form id="ElForm">
  <input type="text" name="input1" id="inputNombre"/>
  <select name="input2">
      <option value="1">1</option>
      <option value="2">2</option>
  </select>
  <input type="checkbox" name="input3" />
  <button type="button" onclick="Generar()">GENERAR</button>
</form>
</html>

este es el segundo html:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <!--Lógica-Programación-->
    <script type="text/javascript" src="logica.js"></script>
    <!--Final de Lógica-Programación -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<!-- Tabla Principal -->
<table style="border: 1px solid #331111;" cellpadding="5">
    <tbody>
<!-- Fila principal -->
        <tr>
            <!-- Columna con logotipo -->
            <td style="border-right: 1px solid #e2e2e2;"> <img style="width: 150px;" src='http://subirimagen.me/uploads/20180829154046.png'  /></td>
            <!-- Columna de información de empresa -->
            <td>
                <table style="font-family: Arial, Helevtica, sans-serif; font-size: 14px; color: #111628;" cellpadding="4">
                    <tbody>
                            
                        <input type="text" class="form-control" id="firstname" name="firstname" required>
                        <tr><td style="font-weight: bold;">Gerente | Empresa</td></tr>
                        <tr><td style="padding-top: 10px;"> <img style="float: left; padding-right: 10px;" src="https://png.icons8.com/metro/15/111628/phone.png"> +52-5555-5555</td></tr>
                        <tr><td> <img style="float: left; padding-right: 10px;" src="https://png.icons8.com/material/15/111628/new-post.png"> <a style="text-decoration: none; color: #111628;" href="mailto:[email protected]">[email protected]</a></td></tr>
                        <tr><td> <img style="float: left; padding-right: 10px;" src="https://png.icons8.com/material/15/111628/internet.png"> <a style="text-decoration: none; color: #111628;" href="http://www.youtube.com">www.youtube.com</a></td></tr>
                        <script>
                            document.addEventListener("DOMContentLoaded", e => {

                            let parms = new URLSearchParams('http://127.0.0.1:5500/index.html');
                            document.getElementById("firstname").value= parms.get("inputNombre");
                            console.log(parms.get("inputNombre"));
                            });
                        </script>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>
</body>
</html>