Code Snippets for custom Components

Code snippet to attach a click handler to a button

// Disable multiple handlers, as these may be used in frame scripts

if(!this.instance_name_here_click_cbk) {

 function instance_name_here_click(evt) {

  // Start your custom code

  console.log("Button clicked");

  // End your custom code

 }
 

 // Attach an event handler on the parent with the filter as the 

 // Component instance’s id

$("#dom_overlay_container").on("click", "#instance_name_here", instance_name_here_click.bind(this));

 this.instance_name_here_click_cbk = true;

}

Please note that the handler is attached to the parent (dom_overlay_container) with the filter set for the component instance. This is important as the component instance may not be present when you are trying to attach the handler. This ensures that the event handlers are fired properly.

You can similarly provide the event handlers for your custom components.

Code snippet to get value from any input control:
console.log($("#instance_name_here").val());

Code snippet to be used when the component instance is attached to DOM

// Listen to the attached event, fired by component runtime
 

$("#dom_overlay_container").on("attached", function(evt, param) {           

// Check the id of the instance 

if(param && param.id == 'movieClip_1') { 
                         

$("#movieClip_1").text("My Button");                          

}

});