Archive for July, 2010
Calculate add,sub,mul using php
Steps:
1. Create new html file and copy calculate.html code and save it as calculate.html.
2. Create new php file and copy calculation.php code and save it as calculation.php.
3. Run calculate.html, then it will display the html data.
4. Enter value1, value2 and press add or sub or mul button and press calculate button.
5. Then it will transfer to calculation.php which displays the output.
calculate.htm:
[php]
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>calculation</title>
</head>
<body>
<form method=”post” action=”calculation.php”>
Value 1: <input type=”text” name=”val1″ size=”7″><br /><br />
Value 2: <input type=”text” name=”val2″ size=”7″>
<p>
<input type=”radio” name=”calculate” value=”add” />
add
<input type=”radio” name=”calculate” value=”sub” />
sub
<input type=”radio” name=”calculate” value=”mul”/>
mul
</p>
<input type=”submit” name=”submit” value=”calculate”/>
</form>
</body>
</html>
[/php]
It displays the output as:
Value 1: Value 2:
add
sub
mul
Transfer data from one page to another using php
Steps:
1:Create new php file and copy file1 code and save it as file1.php.
2.Create another new php file and copy file2 code and save it as file2.php.
3.Run file1.php, then it will display the file1 data.
4.Enter your name, age and location and press the submit button.
5.It will transfer to file2.php and displays the output.
file1:
[php]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>table1</title>
<script language="javascript" type="text/javascript">
function check()
{
if(document.getElementById(‘name1’).value==”)
{
alert("Please enter your name");
document.getElementById(‘name1’).focus();
}
else if(document.getElementById(‘age1’).value==”)
{
alert("please enter your age");
document.getElementById(‘age1’).focus();
}
else if(document.getElementById(‘location1’).value==”)
{
alert("please enter the location");
document.getElementById(‘location1’).focus();
}
else
{
document.form.submit();
}
}
</script>
</head>
<body>
<form method="post" action="file2.php" name="form" >
<table width="100%" border="0">
<tr>
<td><label>Enter your name: </label>
</td>
<td><input type="text" name="name" id="name1"; />
</td>
</tr>
<tr>
<td><label>Enter your age:</label>
</td>
<td><input type="text" name="age" id="age1"; />
</td>
</tr>
<tr>
<td><label>Enter the location:</label>
</td>
<td><input type="text" name="location" id="location1"; />
</td>
</tr>
<tr>
<td colspan="2"> <div align="center">
<input type="button" value="Submit" onclick="check();" name="Submit" />
</div></td>
</tr>
</table>
</form>
</body>
</html>
[/php]
//save this as file1.php
It will display the output as:
file2:
[php]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>table2</title>
</head>
<body>
<?php
$var1=$_POST[‘name’];
$var2=$_POST[‘age’];
$var3=$_POST[‘location’];
echo "your name is: $var1"."<br/>";
echo "your age is: $var2"."<br/>";
echo "loaction is: $var3";
?>
</body>
</html>
[/php]
//save this as file2.php
after entering your name, age and location and pressing the submit button, it displays the output.
For example:
your name is: John
your age is: 25
loaction is: CA
Change Your Page Background Color Dynamically using Java Script
Copy and Paste following code in a simple HTML page.
[html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Change Your page Background Color Using Java Script</title>
<script type="text/javascript">
function changeTheme(selColor) {
alert(selColor);
document.body.style.backgroundColor = selColor;
}
</script>
</head>
<body>
<h1>Please Select Your Page Background Color..</h1>
<select name="changescheme" id="changescheme" onChange="javascript:changeTheme(this.value)">
<option value="white">White</option>
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="orange">Orange</option>
<option value="black">Black</option>
</select>
</body>
</html>
[/html]
Giving Links In CSS
/* The Example1 will be having the font styles,colors and font size for the content present in Example2. copy and paste the code of Example2 to get the output.*/
Example1.css
[css]
body
{
background-color:yellow;
}
h1
{
font-size:36pt;
}
h2
{
color:blue;
}
p
{
margin-left:50px;
}
[/css]
Example2.css
[css]
<html>
<head>
<link rel="stylesheet" type="text/css" href="example1.css" />
</head>
<body>
<h1>Hai!!</h1>
<h2>Have A Nice Day</h2>
</body>
</html>
[/css]
Output:
Hai!!
Have A Nice Day
JavaScript To Find Greatest Among 3 Numbers
/* The Following Script will display the greatest among three numbers*/
[html]
<html>
<head>
<h1>Greatest Among Three Numbers</h1>
</head>
<body>
<script type="text/javascript">
var a=10,b=20,c=7;
/* checks a>b and a>c if both conditions satisfied, A is greater */
if (a>b && a>c)
{
document.write("<b>A is greater</b>");
}
/* checks b>a and b>c if both conditions satisfied, b is greater */
if (b>a && b>c)
{
document.write("<b>B is greater</b>");
}
/* if the above two conditions were false c is greater*/
else
{
document.write("<b>C is greater</b>");
}
</script>
</body>
</html>
[/html]
The Output will be:
Greatest Among Three Numbers
B is Greater
javascript-displays the alert message
Create new html file and copy the code and save it as popup.html.
popup.html
[html]
<strong> </strong><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
function popup()
{
alert("Good morning");
}
</script>
</head>
<body>
<input type="button" onClick="popup()" value="clickhere" />
</body>
</html>
[/html]
It displays the output clickhere button which displays the alert message as “Good morning”
A Simple javascript
[js]
<script type="text/javascript">
<!–
document.write("WELCOME");
–>
</script>
[/js]
It display the output as:
WELCOME
To display the current day and image for a particular day
[php]
<?php
$today=date(l);
if($today==Monday)
{
echo "Today is Monday" ."<br/>";
echo "<img src=’images/image1.gif’>";
}
elseif($today==Tuesday)
{
echo "Today is Tussday" ."<br/>";
echo "<img src=’images/image2.gif’>";
}
elseif($today==Wedsday)
{
echo "Today is Wedsday" ."<br/>";
echo "<img src=’images/image3.gif’>";
}
elseif($today==Thursday)
{
echo "Today is Thursday" ."<br/>";
echo "<img src=’images/image4.gif’>";
}
elseif($today==Friday){
echo "Today is Friday"."<br/>";
echo "<img src=’images/image5.gif’>";
}
elseif($today==Saturday){
echo "Today is Saturday"."<br/>";
echo "<img src=’images/image6.gif’>";
}
elseif($today==Sunday){
echo "Today is Sunday"."<br/>";
echo "<img src=’images/image7.gif’>";
}
?>
[/php]
//create the folder name as images and store the 7 images. So, it will display the todays image.
It display the output as:
Today is Friday
To display current date,no.of days and weeks in a month and year using php
1:Create new php file and copy the code and save it as file1.php.
2.Run file1.php, then it will display the current date and no.of days,weeks in a month and year.
[php]
<?php
echo "My name is: John"."<br/>";
echo "current date is:"."\n" .date("Y m d h: s: m") ."<br/>";
echo "No of days in a month:"."\n" .cal_days_in_month( CAL_GREGORIAN, 07, 2010) ."<br/>";
echo "No of weeks in a month:"."\n".date("w", mktime(0,0,0,12,31,2010)) ."<br/>";
echo "No of weeks in a year:"."\n" .date("W", mktime(0,0,0,12,31,2010)) ."<br/>";
?>
[/php]
It display the output as:
My name is: John
current date is: 2010 07 23 04: 46: 07
No of days in a month: 31
No of weeks in a month: 5
No of weeks in a year: 52
Javascript to wish “Good Morning”
WISHES FOR A DAY
/* This script will display A “Good Morning” Message if the time is less than or equal to 10.Otherwise, it display a “Message Good Day”*/
[js]
<html>
<body>
<script type="text/javascript">
var d = new Date();
var time = d.getHours();
if (time <= 10)
{
document.write("<h1>Hai Good morning!!!</h1>");
}
else
{
document.write("</h1>Good day!!!!!!!</h1>");
}
</script>
</body>
</html>
[/js]
It produces the output as :
if the time is <=10
Hai!!!!Good morning
otherwise
Good day!!!!!!!