Page 148 - CITS - Computer Software Application -TT

COMPUTER SOFTWARE APPLICATION - CITS

<script type=”text/javascript”>

function countpara(){
var totalpara=document.getElementsByTagName(“p”);
alert(“total p tags are: “+totalpara.length);
}
</script>

<p>This is a pragraph</p>
<p>Here we are going to count total number of paragraphs by getElementByTagName() method.</p>
<p>Let’s see the simple example</p>
<button onclick=”countpara()”>count paragraph</button>

In this example, we are dynamically writing the html form inside the div name having the id mylocation. We are
identifing this position by calling the document.getElementById() method.
<script type=”text/javascript” >
function showcommentform() {

var data=”Name:<input type=’text’ name=’name’><br>Comment:<br><textarea rows=’5’ cols=’80’></textarea>
<br><input type=’submit’ value=’Post Comment’>”;
document.getElementById(‘mylocation’).innerHTML=data;
}
</script>

<form name=”myForm”>
<input type=”button” value=”comment” onclick=”showcommentform()”>
<div id=”mylocation”></div>
</form>

JavaScript Form

Summary: in this tutorial, you will learn about JavaScript form API: accessing the form, getting values of the
elements, validating form data, and submitting the form.
Form basics
To create a form in HTML, you use the <form> element:
<form action=”/signup” method=”post” id=”signup”>

</form>Code language: HTML, XML (xml)
The <form> element has two important attributes: action and method.
• The action attribute specifies a URL that will process the form submission. In this example, the action is the /
signup URL.

• The method attribute specifies the HTTP method to submit the form with. Usually, the method is either post or
get.
Generally, you use the get method when you want to retrieve data from the server and the post method when
you want to change data on the server.
JavaScript uses the HTMLFormElement object to represent a form. The HTMLFormElement has the following
properties that correspond to the HTML attributes:

• action – is the URL that processes the form data. It is equivalent to the action attribute of the <form> element.
• method – is the HTTP method which is equivalent to the method attribute of the <form> element.

135

CITS : IT&ITES - Computer Software Application - Lesson 37 - 46