Read form data calculate in Javascript

 

 

 
coding-zon-form-read-JS1

  Table of Contents





Reading form value into JavaScript


 Menu

 


 
<HTML> 
<HEAD>
<TITLE>Test Input</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function read_data(form) {
data = form.t1.value;
alert ("You entered " + data);
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="myform" ACTION="" METHOD="GET">
Enter something in the box: <BR>
<INPUT TYPE="text" NAME="t1" VALUE="" >
<INPUT TYPE="button" NAME="button" Value="Click" onClick=" read_data
(this.form)">
</FORM>
</BODY>
</HTML>

 Result:

 

coding-zon-Reading-text-value2-JS

  Menu

Reading form value into JavaScript when for an onBlur event.

 read_data() function can be call with OnBlur event

 

Example2:
 
<HTML>
<HEAD>
<TITLE>Test Input</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function read_data(form) {
data = form.t1.value;
alert ("You entered : " + data);
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="myform" ACTION="" METHOD="GET">
Enter something in the box: <BR>
<INPUT TYPE="text" NAME="t1" VALUE="" OnBlur="read_data(this.form)">
<INPUT TYPE="button" NAME="button" Value="Click" >


</FORM>
</BODY>
</HTML>

 

coding-zon-Reading-text-value-JS

 Performing calculation with form data in JavaScript

  Menu

Read two numbers from the form and calculate the sum of those numbers and print it on a web page.

 

Example:
 
<html>
<head>
<script language="javascript">
function addNumbers()
{
var val1 = parseInt(document.getElementById("v1").value);
var val2 = parseInt(document.getElementById("v2").value);
document.getElementById("v3").value = val1 + val2;
}
</script>
</head>
<body>
value1 = <input type="text" id="v1" name="v1" value="1"/><br />
value2 = <input type="text" id="v2" name="v2" value="2"/><br />
Result = <input type="text" id="v3" name="v3" value=""/><br />
<input type="button" name="Sumbit" value="Click here" onclick="addNumbers()"/><br />
</body>
</html>

 

coding-zon-Reading-text-values-add-JS

 


 Login Form Validation using JavaScript

 Menu

<html>
<head>
<script language="JavaScript">
function verify()
{
for(i=0;i<document.forms[0].length;i++)
{
if(document.forms[0].elements[i].value=="")
{
alert("Please fill in the
"+document.forms[0].elements[i].name);
document.forms [0].elements[i].focus();
return (false);
}
}
return true;
}
</script>
</head>
<body bgcolor="orange">
<form action="db_login.php" method="GET" OnSubmit="return verify()">
<center>
<br><br><br><br>
<font color="white" size=5>
<u>Login Details</u><br><br><br>
</font>
<table>
<tr>
<td>Username:</td> <td> <input type="text" name="user"/> </td>
</tr>
<tr>
<td>Password:</td> <td> <input type="password" name="pwd"/> <td/>
</tr>
<tr>
<td> </td>
<td> <input type="submit" value="login" /> </td>
</tr>
</table>
</center>
</form>
</body>
</html>

 Result

 Menu

 

coding-zon-login-form-validation-JS

Comments

Popular posts from this blog

Recently viewed list in PHP Mysql

Import CSV File Into MySQL Using PHP

Shoppingcart using PHP Sessions - Miniproject