In this code i have placed a javascript for calculating numbers, total and %age. But when i am using form the javascript calling is not working,
is there any solution......
is there any solution......
Code:
<!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>Staff</title>
<?php include'header2.php' ?>
<?php
session_start();
$connection = mysql_connect('localhost', 'root', '123');
$con = mysql_select_db('new_db',$connection);
if (isset($_POST['submit']))
{
$insert = "INSERT INTO result SET name = '".$_POST['name']."',
math = '".$_POST['math']."',
english = '".$_POST['eng']."',
hindi= '".$_POST['hindi']."',
science = '".$_POST['science']."',
art = '".$_POST['art']."',
total = '".$_POST['total']."',
percentage = '".$_POST['pecentage']."',
passfail= '".$_POST['passfail']."'";
$query = mysql_query($insert) or die (mysql_error());
header('location:result.php');
}
?>
</head>
<script>
function total()
{
var math = parseInt(document.getElementById('math').value);
var eng = parseInt(document.getElementById('eng').value);
var hindi = parseInt(document.getElementById('hindi').value);
var science = parseInt(document.getElementById('science').value);
var result = (math + eng + hindi + science);
var percentage = (math + eng + hindi + science)/4;
document.getElementById('total').value=result;
document.getElementById('percentage').value=percentage;
if (percentage<33)
{
document.getElementById('passfail').value="fail";
}
else if (percentage<50 || percentage<33)
{
document.getElementById('passfail').value="Second Grade";
}
else if (percentage<80 || percentage<60)
{
document.getElementById('passfail').value="First Grade";
}
else
{
document.getElementById('passfail').value="Topper";
}
}
</script>
<style>
.box
{
background-color:#871717;
width:300px;
margin-left:175px;
height:735px;
}
.menubox
{
width:625px;
height:500px;
background-color:#FFF;
position:absolute;
top:150px;
left:550px;
opacity:.8;
}
.result
{
font-family:Georgia, "Times New Roman", Times, serif;
font-size:16px;
font-style:italic;
font-weight:bold;
color:#FFF;
position:absolute;
top:250px;
left:250px;
}
.sec
{
font-family:Verdana, Geneva, sans-serif;
font-size:12px;
color:#FFF;
position:absolute;
top:325px;
left:235px;
text-align:center;
width:175px;
font-style:italic;
}
.border1
{
border:1px solid #FFF;
position:absolute;
top:445px;
left:25px;
width:220px;
}
fieldset
{
width:500px;
border-radius:5px;
}
.res
{
position:absolute;
top:200px;
right:220px;
}
table
{
margin-left:80px;
margin-top:20px;
margin-bottom:20px;
text-align:center;
border-collapse:collapse;
}
input
{
width:150px;
}
</style>
<body>
<div class="box"></div>
<div class="result">Students Results</div>
<div class="menubox"></div>
<div class="sec">Institue students results are displaying here.</div>
<div class="border1"></div>
<div class="res">
<fieldset >
<legend>Students Results</legend>
<table>
<tr><td style="background-color:#69F; color:#FFF">Name<td style="background-color:#69F; color:#FFF; padding:5px 10px 5px 0"><input type="text" name="name" id="name" placeholder= "Student Name" /></td></td></tr>
<tr><td style="background-color:#69F; color:#FFF">Math<td style="background-color:#69F; color:#FFF; padding:5px 10px 5px 0"><input type="text" name="math" id="math" placeholder= "Math Marks" /></td></td></tr>
<tr><td style="background-color:#69F; color:#FFF">English<td style="background-color:#69F; color:#FFF; padding:5px 0 5px 0"><input type="text" name="eng" id="eng" placeholder= "English Marks" /></td></td></tr>
<tr><td style="background-color:#69F; color:#FFF">Hindi<td style="background-color:#69F; color:#FFF; padding:5px 0 5px 0"><input type="text" name="hindi" id="hindi" placeholder= "Hindi Marks" /></td></td></tr>
<tr><td style="background-color:#69F; color:#FFF">Science<td style="background-color:#69F; color:#FFF; padding:5px 0 5px 0"><input type="text" name="science" id="science" placeholder= "Science Marks" /></td></td></tr>
<tr><td style="background-color:#69F; color:#FFF">Art<td style="background-color:#69F; color:#FFF; padding:5px 0 5px 0"><input type="text" name="art" id="art" placeholder= "Art Grades" /></td></td></tr>
<tr><td style="background-color:#871717; color:#FFF">Total<td style="background-color:#871717; color:#FFF; padding:5px 0 5px 0"><input type="text" name="total" id="total" placeholder= "Average" onmouseover="return total()" /></td></td></tr>
<tr><td style="background-color:#871717; color:#FFF">Percentage<td style="background-color:#871717; color:#FFF; padding:5px 0 5px 0"><input type="text" name="percentage" id="percentage" placeholder= "Percentage" onmouseover="return total()" /></td></td></tr>
<tr><td style="background-color:#871717; color:#FFF">Rank<td style="background-color:#871717; color:#FFF; padding:5px 0 5px 0"><input type="text" name="passfail" id="passfail" placeholder= "passfail" onmouseover="return total()"/></td></td></tr>
</table>
</fieldset>
</div>
</body>
</html>
Comment