onDestroy

<< Click to Display Table of Contents >>

Navigation:  Events >

onDestroy

Previous pageReturn to chapter overviewNext page

Performs a function when the component is destroyed. The example uses a button but the concept is the same for all components.

 

Create a new project

 

1. Add a button to the canvas

Set html name to Destroy Button

Set alias to destroyButton

 

2015-08-25_15-45-53

 

2. Add another button to the canvas

Set html name to Button

Set alias to button

 

2015-08-25_15-45-59

 

3. Add a function to the Destroy Button

Select the Destroy Button

Select the onClick ... box

 

2015-08-25_15-58-46

 

This will create a new function with the following code.

 

       _destroybutton_onclick:function (profile, e, value){

           var ns = this, uictrl = profile.boxing();

           ns.button.destroy();

 },

 

4. Save the changes and run the program

 

You should see the 2 buttons. Open your debug window of choice. I use Firebug with Firefox.

 

Click the Destroy Button

 

2015-08-25_16-12-12

 

Clicking the Destroy Button kills off the Button - note there are no errors

 

2015-08-25_16-12-22

 

Clicking the Destroy Button again creates an error as the component has been destroyed already and does not exist.

 

2015-08-25_16-12-31

 

The error message is correct - button is undefined.

 

5. Select Button

 Expand the Events tab

Select the Event - onDestroy ... box

 

2015-08-25_16-17-30

 

A new function and default code is generated.

 

       _button_ondestroy:function (profile){

           var ns = this, uictrl = profile.boxing();

       },

 

Add a debug line of code          console.log("in button_onDestroy function");

 

       _button_ondestroy:function (profile){

           var ns = this, uictrl = profile.boxing();

           console.log("in button_onDestroy function");          

       },

 

Save the changes

Refresh the browser to run the program

Click the Destroy Button

 

2015-08-25_16-22-39

 

The console log message is displayed proving the function has been run prior to the Button being destroyed