• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

HTML5 Password Hidden

Community Beginner ,
Jan 29, 2022 Jan 29, 2022

Copy link to clipboard

Copied

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!

Views

282

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Jan 30, 2022 Jan 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

Votes

Translate

Translate
Community Beginner ,
Jan 29, 2022 Jan 29, 2022

Copy link to clipboard

Copied

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");

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 30, 2022 Jan 30, 2022

Copy link to clipboard

Copied

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 31, 2022 Jan 31, 2022

Copy link to clipboard

Copied

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. 

shawns45366351_0-1643632692500.png

 

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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 31, 2022 Jan 31, 2022

Copy link to clipboard

Copied

Another Weird Question that has happened on multiple projects that I'm not sure why it's occurring, and this happened with both HTML5 and AS3:

 

When I run through a program that includes checking variables and then it goes back to restart the program from the beginning:

  • If I have an alert saying that something needs to be checked the alert will only come up ONCE on the first play through
  • BUT on the second play through the same alert, that should only come up ONCE, pops up twice.
  • on the third play though it pops up three times
  • ON the fourth 4 and so on...

Why is this occurring?

How can I stop this from occurring?

Here is a quick video showing what I am talking about, see attached.

Thank you again!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 31, 2022 Jan 31, 2022

Copy link to clipboard

Copied

Hi.

 

Sorry for the delay,

 

This usually happens when you revisit a frame and listeners of the same type are added more than once to the same instance. Differently from AS3 documents, HTML5 instances are not totally removed from memory when we switch to another frame. Instances are only removed from the display list.

 

One way to avoid this unwanted behavior is to run a simple check in the first frame - or somewhere else - like this:

if (!this.started)
{
    // do something
    this.started = true;
}

 

Please let us know if this the solution for your problem.

 

Regards,

JC

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 02, 2022 Feb 02, 2022

Copy link to clipboard

Copied

I'll test it out and see.

I'm not exactly sure what you are saying here though in the code. Obviously the only part in that I could change is 'started' but I'm not sure what that refering to.

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Feb 08, 2022 Feb 08, 2022

Copy link to clipboard

Copied

LATEST

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. 

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines