-1

Does anyone know how can I resolve the following: I want the form input by the user, to be alerted in a different HTML file.

This is what I wrote so far. It works for the id called 'name', but I dont know why it does not for the 'position'.

"index.html" file:

<script>
    function myFunction() {
        name = document.getElementById("name").value;
        position = document.getElementById("position").value;

        window.location.replace("signature.html");
        return false;
    }
</script>

<form class="formulario" onsubmit="return myFunction()">
      Name: <input type="text" name="name" id="name"><br>
      Position:  <input type="text" name="position" id="position"><br>
      <br>
      <input type="submit" value="Generate Signature">
</form>

"signature.html" file - notice the alert(name) and the alert(position) => the alert(name) works, but not the alert(position). I want to understand how to fix that please.

<html>
<head>
</head>
<body>
<div class="signature_general">
    <div class = "signature_middle">
        <div id = "signature_details">
        <font size="2px">Regards,</font><br>
        <b><font color="#808080" size="3px" id="nameInput">Francisco Jurado</font></b><br>
        <font size="2px" id="posInput">Accounting Systems Team Leader</font>
        </div>
    </div>
</div>

<script>
    alert(name);
    alert(position);
</script>

</body>
</html>

Thanks very much

Edit: I have noticed that I am getting an error, in which "position" is "undefined". Does anyone knows?

Patriots299
  • 365
  • 3
  • 15
  • Obviously, you hasn't decalred the varriables for 'name' and 'position'. try this: var name='test1', position='test2'; alert(name); alert(position); – Sphinx Jan 17 '18 at 19:03
  • @Sphinx edit: do you mean in the "signature.html" file? – Patriots299 Jan 17 '18 at 19:10
  • @Sphinx I have tried the following (perhaps it's not what you mean): declaring in the "index.html" file, as follow: var name = document.getElementById("name").value; var position = document.getElementById("position").value; – Patriots299 Jan 17 '18 at 19:13

2 Answers2

0

That name you are setting in index.html is not the same name you are printing in the alert of signature.html.

You can see this by renaming name to name2 in both places.

If you want to pass those variables from one page to another, I suggest using query strings how to exchange variables between two HTML pages?

Kevin Davis
  • 16
  • 1
  • 1
0

You can change your html file as:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>

<form class="formulario" action="signature.html" method="get">
      Name: <input type="text" name="name" id="name"><br>
      Position:  <input type="text" name="position" id="position"><br>
      <br>
      <input type="submit" value="Generate Signature">
</form> 
</body>
</html>

And your signature.html file as : 

<html>
<head>
</head>
<body>
<div class="signature_general">
    <div class = "signature_middle">
        <div id = "signature_details">
        <font size="2px">Regards,</font><br>
        <b><font color="#808080" size="3px" id="nameInput">Francisco Jurado</font></b><br>
        <font size="2px" id="posInput">Accounting Systems Team Leader</font>
        </div>
    </div>
</div>

<script>
  var values = window.location.search.substring(1).split('&')
  var name = values[0].split('=')[1]
  var position = values[1].split('=')[1]
  alert(name)
  alert(position)
</script>

</body>
</html>
darthweb
  • 10
  • 3