visible in a function is not working

[SCTP12345]

I am using Animate 21.0.9 - html canvas

I have an image that I am hiding at the beginning of the timeline using:
        this.nextBtn.visible = false;
This hides the image with no issues.

I have a function that shows it:
function CheckComplete_btn()
  {
   if (ButtonVisited == 1)
       {
           console.log("TrackSequence Code Ran");
           this.nextBtn.visible = true;
        }
      else
     {
          console.log("TrackSequence Code ELSE Ran");
      }
   }

When I click the button to run the function, I receive the following error code:

The function is running since I receive my console message, but the visible part is throwing an error.

If I take the line this.nextBtn.visible = true; out of the function, it works fine.

Any ideas?

Thanks

[JoãoCésar · Accepted solution]

Hi.

This is a problem of context. The this keyword inside of a function doesn't refer to the current timeline as you're probably expecting.

You should store a reference to the current timeline in a variable, bind the the function to the current timeline, or use the currentTarget property of the event object.

Variable approach:

var _this = this;

function CheckComplete_btn()
{
	_this.nextBtn.visible = true;
}

Bind approach (addEventListener):

this.nextBtn.addEventListener("click", CheckComplete_btn.bind(this));

function CheckComplete_btn()
{
	this.nextBtn.visible = true;
}

Bind approach (on):

this.nextBtn.on("click", CheckComplete_btn.bind, this);

function CheckComplete_btn()
{
	this.nextBtn.visible = true;
}

You can use the two approaches below if the button that received the event listener is the same one that will be set to be visible.

Event.currentTarget (addEventListener):

this.nextBtn.addEventListener("click", CheckComplete_btn);

function CheckComplete_btn(event)
{
	event.currentTarget.visible = true;
}

Event.currentTarget (on):

this.nextBtn.on("click", CheckComplete_btn);

function CheckComplete_btn(event)
{
	event.currentTarget.visible = true;
}

I hope this helps.

Regards,

JC

[SCTP12345]

JC
Thank you for the very quick update. I wish I would have asked this a day and half ago.  🙂

I did the variable option and it worked like a charm.

Louis

[JoãoCésar]

Awesome!

I'm glad it worked!