Example of Creating a Simple Button

To execute the example, add links to the PP.js library and to the table of the PP.css visual styles.

Further the text of the Javascript code is presented with the help of which the button named Apply is located on the HTML page.

<script type="text/javascript">

           var b1 = new PP.Ui.Button({ //create a new object of the Button class;

           ParentNode: document.getElementById("MyButton"),//set ID of the //component that will be stored in the div tag;

           Id: "My Button",//Set component ID;

           ResourceKey : "ButtonExample1",//Set resource key for the component;

           Content: Apply}); //set the key content.

</script>

After executing the example the button looking as follows is placed on the page:

The MyClass user class that implements the btnOnClick event handler is added to the Javascript code for the dialog window with the Button Apply is pressed inscription to be opened on pressing the button:

function MyClass(data)

{

      this.data = data;

      this.btnOnClick = function (sender, args)

   {

               alert("Button Apply is pressed");

   }

}

Then create the object of the MyClass class.

var m = new MyClass(Event handling context is true);

Add the Click event handler to the parameters of the MyButton button:

Click: m.btnOnClick

After executing the example on clicking the Apply button the following message: Button Apply is pressed is displayed.

See also:

Button