Skip to main content
S
shawns45366351
Known Participant
January 29, 2022
Answered

HTML5 Password Hidden

  • January 29, 2022
  • 3 replies
  • 473 views

Hi All,

I'm having a weird issue error come up and I just want to understand why.

Following a tutorial, I've written a simple script to make the password text 'dots' instead of the actual numbers:

 

var passwordInput = document.getElementById("passwordInput");

passwordInput.setAttribute("type", "password");

 

Works great, however I have to place the script on frame 2.

 

If I put it on frame 1, I recvive this error pointing to the second line of code and it does not convert the numbers into dots:

Uncaught TypeError: Cannot read properties of null (reading 'setAttribute')

 

So when I put it on frame 2 it works fine.

 

However, when I go to another page and I send the user back to the login screen (to frame 1 or 2, 0 or 1 in the code due to the HTML5 numbering) I get the error again, BUT this time it does continue to convert the numbers into dots.

 

So it works, but I'm wondering why I'm still getting an error and if I should be doing something differently?

 

Thank you again!

    This topic has been closed for replies.
    Correct answer JoãoCésar17023019

    Hi.

     

    It's because components are not immediately available in the first frame of the main timeline. One way of being sure they are ready is to listen for the drawend event on the stage. Like this:

    stage.on("drawend", function() // components cannot be accessed immediately
{
	var passwordDots = document.getElementById("passwordInput");
	passwordDots.setAttribute("type", "password");
}, this, true);

     

    I hope it helps.

     

    Regards,

    JC

    3 replies

    N
    nerd9452
    Participant
    February 8, 2022

    U can add it to .CSS file for 

    var passwordInput = document.getElementById("passwordInput");

    passwordInput.setAttribute("type", "password");

     with HTML5 design code and HTML 4 design code to make a form for this problem and Great resourses are search for HTML coding can be find in Books,Java,Magazines and at Library. But Internet search Tools are better for more handly with YouTube Video for them, edu can help u too and lot more info about like Adobe Dreamweaver(Web Dev) sorry Flash software and shockwave are Not Long been use for Website,Non websites designs with Flash software and shockwave to review them. Notepad++  can let u do HTML Codes but you to no the code for this. 

     

    JoãoCésar17023019
    Community Expert
    JoãoCésar17023019Community ExpertCorrect answer
    Community Expert
    January 30, 2022

    Hi.

     

    It's because components are not immediately available in the first frame of the main timeline. One way of being sure they are ready is to listen for the drawend event on the stage. Like this:

    stage.on("drawend", function() // components cannot be accessed immediately
{
	var passwordDots = document.getElementById("passwordInput");
	passwordDots.setAttribute("type", "password");
}, this, true);

     

    I hope it helps.

     

    Regards,

    JC

    S
    shawns45366351Author
    Known Participant
    January 31, 2022

    Thank you again JC, great fix and it worked.

     

    However, I did place the code on frame 2. But it only errored when I sent the program from frame 5 back to frame 1 (4 to 0), not when it started. 

     

    So while this is a great fix, I'm not sure I understand why it errors on the return from another frame. without this code.

    Again, I'm just looking for understanding, I'm not challenging the answer.

    S
    shawns45366351Author
    Known Participant
    January 30, 2022

    FYI, I changed the variable to passwordDots so as to not create confusion in the code. Problem still persists, but the code looks better:

     

    var passwordDots = document.getElementById("passwordInput");

    passwordDots.setAttribute("type", "password");

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices