form validation Archives - https://mitindia.in/tag/form-validation/ Sat, 26 Nov 2016 07:28:02 +0000 en-US hourly 1 https://wordpress.org/?v=6.9.4 https://mitindia.in/wp-content/uploads/2023/03/cropped-android-chrome-512x512-1-32x32.png form validation Archives - https://mitindia.in/tag/form-validation/ 32 32 Javascript programs https://mitindia.in/javascript-programs/ https://mitindia.in/javascript-programs/#comments Tue, 28 Jun 2016 06:42:57 +0000 http://www.mitindia.in/?p=181 Java Script is an interpreted, object-based scripting language, developed by Sun Micro systems and Netscape.  JavaScript makes it easier to create interactive Web Pages.  Common Gateway Interface was considered as the standard for processing the forms. It was time consuming process because form validation used to take place on the server side.  JavaScript made the entire work easier by […]

The post Javascript programs appeared first on .

]]> Java Script is an interpreted, object-based scripting language, developed by Sun Micro systems and Netscape.  JavaScript makes it easier to create interactive Web Pages.  Common Gateway Interface was considered as the standard for processing the forms. It was time consuming process because form validation used to take place on the server side.  JavaScript made the entire work easier by validating the form at the client side.

List of Javascript programs are given below with output screenshots as well and you need to copy the code as an individual program and paste in Notepad then save with .html (exa: mywebpage.html) file extension and see output in the browser.

1. Javascript Program to display DIGITAL CALCULATOR 

calc

<html>
<head>
<script language="javascript">
function calc(ch)
{
if(ch=="=")
{
document.f1.t1.value=eval(document.f1.t1.value)
}
else
{
if(ch=="C")
{
document.f1.t1.value=""
}
else
{
document.f1.t1.value+=ch
}
}
}
</script>
</head>
<body>
<h2> DIGITAL CALCULATOR </h2>
<form name=f1>
<input type=text name=t1 size=24> <br>
<table border=2 cellspacing=6 cellpadding=6>
<tr>
<td> <input type=button value="7" onClick="calc('7')">
<td> <input type=button value="8" onClick="calc('8')">
<td> <input type=button value="9" onClick="calc('9')">
<td> <input type=button value="*" onClick="calc('*')">
</tr>
<tr>
<td> <input type=button value="4" onClick="calc('4')">
<td> <input type=button value="5" onClick="calc('5')">
<td> <input type=button value="6" onClick="calc('6')">
<td> <input type=button value="/" onClick="calc('/')">
</tr>
<tr>
<td> <input type=button value="1" onClick="calc('1')">
<td> <input type=button value="2" onClick="calc('2')">
<td> <input type=button value="3" onClick="calc('3')">
<td> <input type=button value="-" onClick="calc('-')">
</tr>
<tr>
<td> <input type=button value="0" onClick="calc('0')">
<td> <input type=button value="C" onClick="calc('C')">
<td> <input type=button value="=" onClick="calc('=')">
<td> <input type=button value="+" onClick="calc('+')">
</tr>
</table>
</form>
<h3> by MIT India </h3>
</body>
</html>

2. Automatic Background Color Change using[timer method] Javascript. 

backcolor

<html>
<head>
<script language="javascript">
colours=new Array("red", "green", "blue", "yellow", "pink", "cyan")
index=0
function func()
{
if(index>5)
{
index=0
document.bgColor=colours[index]
index++
}
else
{
document.bgColor=colours[index]
index++
}
}
function startbk()
{
ref=setInterval('func()', 1000)
}
function stopbk()
{
clearInterval(ref)
}
</script>
</head>
<body>
<marquee><h1> Text Effect </h1> </marquee>
<input type=button name=b1 value="Start" onClick='startbk()'>
<input type=button name=b2 value="Stop" onClick='stopbk()'>
</body>
</html>

3. Digital CLOCK program using Javascript 

dc

<html>
<head>
<script language="javascript">
function disp()
{
dt=new Date()
h=dt.getHours() % 12 || 12;
m=dt.getMinutes()
s=dt.getSeconds()
document.f1.t1.value=h
document.f1.t2.value=m
document.f1.t3.value=s
}
</script>
</head>
<body>
<script language="javascript">
setInterval('disp()', 1000)
</script>
<form name=f1>
<input type=text name=t1 size=2>
<input type=text name=t2 size=2>
<input type=text name=t3 size=2>
</form>
</body>
</html>

4. File Open method using Javascript 

fileopen

<html>
<head>
<script language="javascript">
function f5()
{
var op
op=open("dht.html")
}
function f2()
{
var op
op=open("js2.html")
}
function f3()
{
var op
op=open("js.html")
}
</script>
</head>
<body>
<h1> File Open Method </h1>
<form name=f1>
<input type=button name=b1 value="File1" onClick='f5()'>
<input type=button name=b2 value="File2" onClick='f2()'>
<input type=button name=b3 value="File3" onClick='f3()'>
</form>
</body>
</html>

5. Email and Phone number Validation using Javascript 

email

<html>
<head>
<script language="javascript">
function val()
{
var str, str2
str=document.f1.t1.value
str2=document.f1.t2.value
if (str2=="")
{
alert("Enter Phone number")
}
len=str.length
for(i=2; i<len; i++)
{
if(str.charAt(i)=='@')
{ return true}
}
alert("Invalid EmailId")
return false
}
</script>
</head>
<body>
<h1> Email and Phone Number Validation </h1>
<form name=f1>
Enter Email ID <input type=text name=t1> <br>
Enter Phone: <input type=text name=t2> <br>
<input type=button name=b1 value="Check" onClick='val()'>
</form>
</body>
</html>

6. All arithmetic  operation program using javascript

aop

<html> 
<head>
<title> Using loop </title>
<script language="javascript">
function add()
{
document.f1.t3.value=parseInt(document.f1.t1.value)+parseI
nt(document.f1.t2.value)
}
function sub()
{
document.f1.t3.value=parseInt(document.f1.t1.value)-parseIn
t(document.f1.t2.value)
}
function mul()
{
document.f1.t3.value=parseInt(document.f1.t1.value)*parseIn
t(document.f1.t2.value)
}
function div()
{
document.f1.t3.value=parseInt(document.f1.t1.value)/parseIn
t(document.f1.t2.value)
}
</script>
</head>
<body>
<h1 align="center"> Simple Form </h1> <hr>
<form name=f1>
<table>
<tr> <td>Enter Num1: </td> <td><input type=text
name=t1></td> </tr>
<tr><td>Enter Num2: </td> <td><input type=text
name=t2> </td> </tr>
<tr> <td>Result: </td> <td><input type=text name=t3>
</td> </tr>
<tr> <td> <input type=button name=b1 value="Add"
onClick='add()'>
<input type=button name=b2 value="Subtract"
onClick='sub()'> </td>
<td>
<input type=button name=b3 value="Multiplication"
onClick='mul()'>
<input type=button name=b4 value="Division"
onClick='div()'>
<input type=reset name=b5 value="Reset"> </td> </tr>
</table>
</form>
</body>
</html>

7. Radio button and check box demo program

rc

<html>
<body>
<h1 align=center> Using Checkbox and Radio Buttons </h1>
<hr>
<h4> Hobbies </h4>
<form name=f1>
<input type=checkbox name=c1 value=music> Music <br>
<input type=checkbox name=c2 value=read> Reading <br>
<input type=checkbox name=c3 value=watchtv> Watching TV
<br>
<hr>
<h4> Mode of Payment </h4>
<input type=radio name=r1 value=mop> Cash <br>
<input type=radio name=r1 value=mop> Credit <br>
<hr>
<input type=button name=b1 value="Submit">
<input type=button name=b2 value="Cancel">
</form>
</body>
</html>

8. A Web Program on DHTML Effects 

dht

<html>
<head>
<title> Using DHTML </title>
</head>
<body>
<h1>Using DHTML </h1>
<p> <marquee behavior=scroll direction=right scrollamount=3> This is sample DHTML text effect </marquee> </p>
<hr>
<p> <marquee behavior=scroll direction=up scrollamount=3> This is sample DHTML text effect </marquee> </p>
<hr>
<p> <marquee behavior=scroll direction=down scrollamount=3> This is sample DHTML text effect </marquee> </p>
<h1 onMouseOver='this.style.color="red"'> Place here mouse cursor here </h1>
<h1 onClick='this.style.color="blue"'> Place here mouse cursor here </h1>
<h1 onDblClick='this.style.color="Green"'> Place here mouse cursor here </h1>
</body>
</html>

9. Find length of the entered STRING

los

<html>
<body>
<script language="javascript">
var len, str
str=prompt("Enter any string")
len=str.length
document.write("total no of characters in the string:"+len)
</script>
</body>
</html>

10. String Functions program on Javascript

sf

<html>
<body>
<script language="javascript">
var str,str2,str3
str=prompt("Enter any string")
str2=str.toUpperCase()
document.write("<h1>"+"String Functions"+"</h1>")
document.write("Upper case string is :"+ str2)
document.write("<br>")
str3=str.toLowerCase()
document.write("Lower case string is :"+ str3)
document.write("<br>")
arr=new Array(1,2,3,4,5)
document.write("Reverse array is :"+arr.reverse())
document.write("<br>")
arr2=new Array(1,5,2,3,4)
document.write("Sorted array is :"+arr2.sort())
document.write("<br>")
arr3=new Array(1,5,2,3,4)
document.write("separator is :"+arr3.join('*'))
document.write("<br>")
</script>
</body>
</html>

 

Share

The post Javascript programs appeared first on .

]]> https://mitindia.in/javascript-programs/feed/ 1