Connecting HTML and JavaScript

Code Help HTML/CSS/JS
1

Question: I recently have been trying to play around with interconnecting these languages for a makeshift login page. I unfortunately wasn’t able to figure out how to get a specific element’s text property and then apply it to a label. Could someone please help me/ explain what I need to do?

Project

HTML:

<form>
    <label for="usname">Username:</label>
    <input type="text" id="usname" name="usname"><br><br>
    <label for="ps">Password:</label>
    <input type="text" id="ps" name="ps"><br><br>
    <input type="submit" id="submit" value="Submit">
  </form>

  <label id="info" name="info">Info:</label>

JavaScript:

var username = document.getElementById("usname");
var password = document.getElementById("ps");
function updateInfo() {
  document.getElementById("info").textContent = "Info: " + username + " " + password;
}
2

:wave: Welcome @jonahkatzowitz!

It doesn’t seem that you actually ever call the updateInfo function based on the code you provided.

3

I realized that, but where should I call the function?

4

Maybe you should change your code to call the updateInfo function using onclick on the submit input (or anything else you prefer):

<input type="submit" id="submit" value="Submit" onclick="updateInfo">

And on the javascript code you provided, you are actually getting the DOM element itself, and not the value of the username and password input. So instead, use username.value and password.value.

1 Like