Tuesday, December 24, 2013

Text Area



A multi-row text area form element. The initial value of the text area can be placed in between the opening and closing tags.

HTML
<textarea rows="4" cols="100" id="ta1" onclick="MyFunction()">
  A multi-row text area form element. The initial value of the text area can be placed in between the opening and closing tags.
</textarea>

JavaScript
function MyFunction() {
 var content = document.getElementById("ta1").innerHTML;
 alert(content);
 document.getElementById("ta1").innerHTML = "This is new content.";
}

Events
Events
Description
onBlur
Code is executed when the focus is removed from the textarea.
onChange
Code is executed when the user changes the value within the textarea, and removes focus away from the field.
onFocus
Code is executed when the focus is set on the textarea.
onKeyDown
Code is executed when user presses down the key within the textarea.
onKeyPress
Code is executed when user presses the key within the textarea.
onKeyUp
Code is executed when user releases a key within the textarea.
onSelect
Code is executed when user selects some text within the textarea.


Properties
Properties
Description
form
References the form that contains the reset button.
accessKey
String value that sets/ returns the accessKey for the button.
name
Reflects the name of the text field (the name attribute).
id
Reflects the id of the text field (the id attribute).
rows
Rows is used to define the number of viewable rows.

HTML

<textarea rows="10" id="ta1" onclick="MyFunction()"></textarea>

JavaScript

function MyFunction() {

  var rows = document.getElementById("ta1").rows;
  alert(rows);
  document.getElementById("ta1").rows = "20";

 }

cols
Cols is used to specify the number of viewable columns.

HTML
<textarea rows="10" cols="10" id="ta1" onclick="MyFunction()"></textarea>

JavaScript
function MyFunction() {

  var columns = document.getElementById("ta1").cols;
  alert(columns);
  document.getElementById("ta1").cols = "20";

 }

readonly
readonly can be used to specify that the value of the element cannot be changed. It must be used in the format readonly=”readonly”.
HTML
<textarea rows="4" cols="100" id="ta1" readonly="readonly">

      A multi-row text area form element. The initial value of the text area can be placed in between the opening and closing tags.

</textarea>

Javascript
function MyFunction() {
 var ro = document.getElementById("ta1").readOnly;
 alert(ro);
 document.getElementById("ta1").readOnly = false;
}

dir
Ltr or  rtl. The dir attribute specifies the text direction of the element's content.
disabled
Boolean value that sets/ returns whether the button is disabled.
tabindex
The tabindex attribute specifies the tab order of an element (when the "tab" button is used for navigating).
class
The class attribute specifies one or more classnames for an element.
style
The style attribute specifies an inline style for an element.
title
The title attribute specifies extra information about an element.
The information is most often shown as a tool tip text when the mouse moves over the element.

Methods
Methods
Description
blur()
Removes focus away from the radio button.

click()
Simulates a user clicking on the radio button.

focus()
Sets focus on the radio button.