JavaScript

Creation of Dynamic rows in javascript

Mallik4 Comments

Create a html file with this code and check the functionality:

<html>
<head>
<script LANGUAGE=”JavaScript”>
function addRow(tableID){
var table = document.getElementById(tableID);

var rowCount = table.rows.length;
var row = table.insertRow(rowCount);

var cell1 = row.insertCell(0);
var element1 = document.createElement(“input”);
element1.type = “text”;
element1.name = “empNo”;
cell1.appendChild(element1);

var cell2 = row.insertCell(1);
var element2 = document.createElement(“input”);
element2.type = “text”;
cell2.appendChild(element2);

var cell3 = row.insertCell(2);
var element3 = document.createElement(“textarea”);
element3.setAttribute(“name”,”mytextarea”);
element3.setAttribute(“cols”,”10″);
element3.setAttribute(“rows”,”1″);
cell3.appendChild(element3);
}
function deleteRow(tableID) {

var table = document.getElementById(tableID);
var rowCount = table.rows.length;
if(rowCount > 1) {
table.deleteRow(rowCount – 1);
}

}
</script>
</head>
<body>
<form name=”f1″ id=”f1″>
<input type=”button”value=”Add” onclick=”addRow(‘datatable’)”>
<table id=”datatable” cellspacing=”0″ border=”1″ bgcolor=”#738711″>
<tbody>
<tr>
<td><input type=”text” ></td><td><input type=”text”></td><td><textarea rows=”1″ cols=”10″></textarea></td>

<td><a href=”javascript:void(0);” onclick=”deleteRow(‘datatable’)” >Remove</a></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>

Conversion of string into uppercase

Mallik1 Comment

The below function is used to convert the alphabets into uppercase

function convertToUpper(){
var field1 = document.formName.elementName

field1.value = field1.value.toUpperCase();
}

Example :
If the formName is StudentForm and element name is student id like stud100

Then ,
function convertToUpper(){
var field1 = document.StudentForm.StudentId

field1.value = field1.value.toUpperCase();

}

gives the value as STUD100.

AJAX

Mallik1 Comment

What is Ajax?
Asynchronous JavaScript and XML.
Ajax is not a new programming language but a new way to use existing standards.

Basic requirements to learn Ajax:
HTML or XHTML and Java Script.

Ajax applications are browser and platform independent.
Advantages:
These applications make the user to communicate asynchronously between browser and server.

With AJAX, a JavaScript can communicate directly with the server, with the XMLHttpRequest object. With this object, a JavaScript can trade data with a web server, without reloading the page.

AJAX uses asynchronous data transfer (HTTP requests) between the browser and the web server, allowing web pages to request small bits of information from the server instead of whole pages.

The AJAX technique makes Internet applications smaller, faster and more user-friendly.