Sunday 10 January 2021

How to create automatic result showing page with students name on HTML?

 How to create automatic result showing page with students name on HTML?

here we write a html program using table tag and form tag with java script 
you can use this program to check result of any student .
firstly you enter details of student and then you click on button
then you find automatic result of student in this program we take five subjects and calculate percentage on 100 marks of
each subject and if student archive greater than thirty three marks then 
the student show pass otherwise  show failed.

here you see the html code
<html>
<head>
<title>school websites template</title>
 <script>
 function postdata()
 {
 var sn=document.getElementById("sname").value;
 var em=Number(document.getElementById("emark").value);
 var mm=Number(document.getElementById("mmark").value);
 var cm=Number(document.getElementById("cmark").value);
 var chm=Number(document.getElementById("chmark").value);
 var pym=Number(document.getElementById("pmark").value);
 var total=em+mm+cm+chm+pym;
 var percentage=(total*100)/500;
 if(percentage<33)
 {
  document.getElementById("result").value="Faild";
 }
 else{
 document.getElementById("result").value="pass";
 }
 document.getElementById("per").value=percentage;
  document.getElementById("ssname").value="Ms "+sn;

 }
 </script>
 
</head>
<body bgcolor="pink">
<center>
<table border="1" bordercolor="pink">
<caption>Enter student details</caption>
<form method="GET" >
<tr><td>Enter studen name</td><td><input type="text" name="sname" id="sname"/></td></tr>
<tr><td>Enter marks in English</td><td><input type="text" name="emark" id="emark"/></td></tr>
<tr><td>Enter marks in Maths</td><td><input type="text" name="mmark" id="mmark"/></td></tr>
<tr><td>Enter marks in computer</td><td><input type="text" name="cmark" id="cmark"/></td></tr>
<tr><td>Enter marks in chemistry</td><td><input type="text" name="chmark" id="chmark"/></td></tr>
<tr><td>Enter marks in Physics</td><td><input type="text" name="pmark" id="pmark"/></td></tr>
<tr><td align="center" colspan="2"><input style="background-color:pink;border:none;" type="text"  name="ssname" id="ssname"/></td></tr>

<tr><td>Result <input type="text" id="result" name="reulst"</td><td><input type="text" name="per" id="per"/></td></tr>

<tr><td colspan="2" align="center"><input type="button" value="chec result" onclick="postdata()"/></td></tr>
</form>
</table>
</body>
</html>

output of this programs



0 comments:

Post a Comment