To execute the example, create an HTML page and perform the following operations:
1. Add links to the PP.css and PP.js files.
2. Next in the <head> tag set style for the element with the ID "TL":
<style>
#TL {
border-color: #CCCCCC;
border-width: 0px;
border-style: solid;
width: 250px;
}
</style>
2. Within the <body> tag place a block with the ID "TL" :
<div id="TL"></div>
3. Next in the page within the <body> tag add a script that creates text boxes:
<script type = "text/javascript">
// Create text box component
var textArea1 = new PP.Ui.TextArea({
ParentNode: 'TL', // Identifier of parent container
Content: 'Text area 1' // Component text
});
// Create text text box component
var textArea2 = new PP.Ui.TextArea({
ParentNode: 'TL', // Identifier od parent container
Content: 'Text area 2', // Component text
ReadOnly: true // Disable enter text to the component
});
</script>
To execute custom scripts for the text fields, including the examples given in the pages that contain descriptions of properties, methods and events of this component, place the code after the script specified above or in the browser console.
4. At the end of the document insert a code that sets styles corresponding to client's operating system, to the document.body node:
<script type="text/javascript"> PP.initOS(document.body); </script>
After executing the example two PP.Ui.TextArea components are placed in the HTML page. Text input is available in the textArea1 component and not available in textArea2.
See also: