我有一张表格,其中包含学生的详细信息和输入学生标记的选项。学生的详细信息来自MySQL DB。我试图根据输入标记填充总分,百分比和等级。 我只能为第一行进行计算。总分,百分比和等级的自动人口没有发生在第二排。表结构和脚本如下。附上我的桌子的屏幕截图也提供了。在屏幕截图中,只读字段使用脚本自动填充。 请帮忙。
HTML表格结构
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>
<center>
Srl#
</center>
</th>
<th>
<center>
ID
</center>
</th>
<th>
<center>
Student Name
</center>
</th>
<th width="8%">
<center>
Unit Test
</center>
</th>
<th colspan="4">
<center>
Individual Activity
</center>
</th>
<th width="6%">
<center>
Total
</center>
</th>
<th colspan="4">
<center>
Group Activity
</center>
</th>
<th width="6%">
<center>
Total
</center>
</th>
<th width="9%">
<center>
Grand Total
</center>
</th>
<th>
<center>
%
</center>
</th>
<th>
<center>
Grade
</center>
</th>
</tr>
</thead>
<tbody>
<?php
if (isset($_POST['stmkadls'])) {
$stcl = $_POST['stcls'];
$stdv = $_POST['stdv'];
$sql = "select gps_div_id as dvid,gps_st_uid as stuid,gps_st_name as stnm,gps_st_class as stcl,gps_st_division as stdv from gps_stdnt_class_div_xref where gps_st_class = '$stcl' and gps_st_division = '$stdv' and gps_st_div_stat = 'Y' order by gps_st_name";
$result = mysqli_query($GLOBALS["___mysqli_ston"], $sql) or die(((is_object($GLOBALS["___mysqli_ston"])) ? mysqli_error($GLOBALS["___mysqli_ston"]) : (($___mysqli_res = mysqli_connect_error()) ? $___mysqli_res : false)));
if (mysqli_num_rows($result) > 0)
$no = 1;
while ($row = mysqli_fetch_array($result)) {
$dvid = $row['dvid'];
$stuid = $row['stuid'];
$stnm = $row['stnm'];
$stcl = $row['stcl'];
$stdv = $row['stdv'];
?>
<tr>
<td class="highlight">
<div class="success">
<a href="javascript:;">
<?php echo $no ?> </a>
</div>
</td>
<td>
<?php echo $stuid ?>
</td>
<td>
<?php echo $stnm ?>
</td>
<td>
<input type="number" name="utst" id="utst" class="form-control form-filter">
</td>
<td>
<input type="text" name="iam1" id="iam1" class="form-control form-filter" onkeyup="sum();" required>
</td>
<td>
<input type="text" name="iam2" id="iam2" class="form-control form-filter" onkeyup="sum();" required >
</td>
<td>
<input type="text" name="iam3" id="iam3" class="form-control form-filter" onkeyup="sum();" required >
</td>
<td>
<input type="text" name="iam4" id="iam4" class="form-control form-filter" onkeyup="sum();" required >
</td>
<td>
<input type="text" name="iamtot" id="iamtot" class="form-control form-filter" readonly >
</td>
<td>
<input type="text" name="gam1" id="gam1" class="form-control form-filter" onkeyup="sum();" required>
</td>
<td>
<input type="text" name="gam2" id="gam2" class="form-control form-filter" onkeyup="sum();" required>
</td>
<td>
<input type="text" name="gam3" id="gam3" class="form-control form-filter" onkeyup="sum();" required>
</td>
<td>
<input type="text" name="gam4" id="gam4" class="form-control form-filter" onkeyup="sum();" required>
</td>
<td>
<input type="text" name="gamtot" id="gamtot" class="form-control form-filter" readonly >
</td>
<td>
<span class="center">
<input type="text" name="grntot" id="grntot" class="form-control form-filter" readonly >
</span>
</td>
<td>
<input type="text" name="percent" id="percent" class="form-control form-filter" readonly >
</td>
<td>
<input type="text" name="grade" id="grade" class="form-control form-filter" readonly >
</td>
<?php $no++; ?>
</tr>
<?php
}
}
?>
</tbody>
</table>
用于计算总数和百分比的脚本。
<script>
function sum() {
var Iam1 = document.getElementById('iam1').value;
if (Iam1=='')
Iam1 = parseInt('0');
var Iam2 = document.getElementById('iam2').value;
if (Iam2=='')
Iam2 = parseInt('0');
var Iam3 = document.getElementById('iam3').value;
if (Iam3=='')
Iam3 = parseInt('0');
var Iam4 = document.getElementById('iam4').value;
if (Iam4=='')
Iam4 = parseInt('0');
var iamtot = parseInt(Iam1) + parseInt(Iam2) + parseInt(Iam3) + parseInt(Iam4);
document.getElementById('iamtot').value = iamtot;
var Gam1 = document.getElementById('gam1').value;
if (Gam1=='')
Gam1 = parseInt('0');
var Gam2 = document.getElementById('gam2').value;
if (Gam2=='')
Gam2 = parseInt('0');
var Gam3 = document.getElementById('gam3').value;
if (Gam3=='')
Gam3 = parseInt('0');
var Gam4 = document.getElementById('gam4').value;
if (Gam4=='')
Gam4 = parseInt('0');
var gamtot = parseInt(Gam1) + parseInt(Gam2) + parseInt(Gam3) + parseInt(Gam4);
document.getElementById('gamtot').value = gamtot;
var UtSt = document.getElementById('utst').value;
if (UtSt=='')
UtSt = parseInt('0');
var max = Math.max(iamtot,gamtot);
var grt = (parseInt(max) + parseInt(UtSt))/2;
var grt = grt.toFixed(2);
document.getElementById('grntot').value = grt;
var per = (parseInt(grt)/20)*100;
document.getElementById('percent').value = per;
var Grade;
if( parseInt(per) >= 90 ){
Grade = "A1";
}
else if( parseInt(per) >= 80 ){
Grade = "A2";
}
else if( parseInt(per) >= 70 ){
Grade = "B1";
}
else if( parseInt(per) >= 60 ){
Grade = "B2";
}
else if( parseInt(per) >= 50 ){
Grade = "C1";
}
else if( parseInt(per) >= 40 ){
Grade = "C2";
}
else if( parseInt(per) >= 33 ){
Grade = "D";
}
else if( parseInt(per) >= 21 ){
Grade = "E1";
}
else {
Grade = "E2";
}
document.getElementById('grade').value = Grade;
}
</script>
答案 0 :(得分:1)
借助Sean提供的提示,我已经进行了更改,使ID在我的代码之上独一无二。它按预期工作。附加HTML代码和脚本。
修改了HTML表格结构。
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>
<center>
Srl#
</center>
</th>
<th>
<center>
ID
</center>
</th>
<th>
<center>
Student Name
</center>
</th>
<th width="8%">
<center>
Unit Test
</center>
</th>
<th colspan="4">
<center>
Individual Activity
</center>
</th>
<th width="6%">
<center>
Total
</center>
</th>
<th colspan="4">
<center>
Group Activity
</center>
</th>
<th width="6%">
<center>
Total
</center>
</th>
<th width="9%">
<center>
Grand Total
</center>
</th>
<th>
<center>
%
</center>
</th>
<th>
<center>
Grade
</center>
</th>
</tr>
</thead>
<tbody>
<?php
if (isset($_POST['stmkadls'])) {
$stcl = $_POST['stcls'];
$stdv = $_POST['stdv'];
$sql = "select gps_div_id as dvid,gps_st_uid as stuid,gps_st_name as stnm,gps_st_class as stcl,gps_st_division as stdv from gps_stdnt_class_div_xref where gps_st_class = '$stcl' and gps_st_division = '$stdv' and gps_st_div_stat = 'Y' order by gps_st_name";
$result = mysqli_query($GLOBALS["___mysqli_ston"], $sql) or die(((is_object($GLOBALS["___mysqli_ston"])) ? mysqli_error($GLOBALS["___mysqli_ston"]) : (($___mysqli_res = mysqli_connect_error()) ? $___mysqli_res : false)));
if (mysqli_num_rows($result) > 0)
$no = 1;
while ($row = mysqli_fetch_array($result)) {
$dvid = $row['dvid'];
$stuid = $row['stuid'];
$stnm = $row['stnm'];
$stcl = $row['stcl'];
$stdv = $row['stdv'];
?>
<tr>
<td class="highlight">
<div class="success">
<a href="javascript:;">
<?php echo $no ?> </a>
</div>
</td>
<td>
<?php echo $stuid ?>
</td>
<td>
<?php echo $stnm ?>
</td>
<td>
<input type="number" name="utst" id="utst<?php echo $no ?>" class="form-control form-filter">
</td>
<td>
<input type="text" name="iam1" id="iam1<?php echo $no ?>" class="form-control form-filter" onkeyup="sum(<?php echo $no ?>);" required>
</td>
<td>
<input type="text" name="iam2" id="iam2<?php echo $no ?>" class="form-control form-filter" onkeyup="sum(<?php echo $no ?>);" required >
</td>
<td>
<input type="text" name="iam3" id="iam3<?php echo $no ?>" class="form-control form-filter" onkeyup="sum(<?php echo $no ?>);" required >
</td>
<td>
<input type="text" name="iam4" id="iam4<?php echo $no ?>" class="form-control form-filter" onkeyup="sum(<?php echo $no ?>);" required >
</td>
<td>
<input type="text" name="iamtot" id="iamtot<?php echo $no ?>" class="form-control form-filter" readonly >
</td>
<td>
<input type="text" name="gam1" id="gam1<?php echo $no ?>" class="form-control form-filter" onkeyup="sum(<?php echo $no ?>);" required>
</td>
<td>
<input type="text" name="gam2" id="gam2<?php echo $no ?>" class="form-control form-filter" onkeyup="sum(<?php echo $no ?>);" required>
</td>
<td>
<input type="text" name="gam3" id="gam3<?php echo $no ?>" class="form-control form-filter" onkeyup="sum(<?php echo $no ?>);" required>
</td>
<td>
<input type="text" name="gam4" id="gam4<?php echo $no ?>" class="form-control form-filter" onkeyup="sum(<?php echo $no ?>);" required>
</td>
<td>
<input type="text" name="gamtot" id="gamtot<?php echo $no ?>" class="form-control form-filter" readonly >
</td>
<td>
<span class="center">
<input type="text" name="grntot" id="grntot<?php echo $no ?>" class="form-control form-filter" readonly >
</span>
</td>
<td>
<input type="text" name="percent" id="percent<?php echo $no ?>" class="form-control form-filter" readonly >
</td>
<td>
<input type="text" name="grade" id="grade<?php echo $no ?>" class="form-control form-filter" readonly >
</td>
<?php $no++; ?>
</tr>
<?php
}
}
?>
</tbody>
</table>
修改过的脚本
<script>
function sum(obj) {
var Iam1 = document.getElementById('iam1'+obj).value;
if (Iam1=='')
Iam1 = parseInt('0');
var Iam2 = document.getElementById('iam2'+obj).value;
if (Iam2=='')
Iam2 = parseInt('0');
var Iam3 = document.getElementById('iam3'+obj).value;
if (Iam3=='')
Iam3 = parseInt('0');
var Iam4 = document.getElementById('iam4'+obj).value;
if (Iam4=='')
Iam4 = parseInt('0');
var iamtot = parseInt(Iam1) + parseInt(Iam2) + parseInt(Iam3) + parseInt(Iam4);
document.getElementById('iamtot'+obj).value = iamtot;
var Gam1 = document.getElementById('gam1'+obj).value;
if (Gam1=='')
Gam1 = parseInt('0');
var Gam2 = document.getElementById('gam2'+obj).value;
if (Gam2=='')
Gam2 = parseInt('0');
var Gam3 = document.getElementById('gam3'+obj).value;
if (Gam3=='')
Gam3 = parseInt('0');
var Gam4 = document.getElementById('gam4'+obj).value;
if (Gam4=='')
Gam4 = parseInt('0');
var gamtot = parseInt(Gam1) + parseInt(Gam2) + parseInt(Gam3) + parseInt(Gam4);
document.getElementById('gamtot'+obj).value = gamtot;
var UtSt = document.getElementById('utst'+obj).value;
if (UtSt=='')
UtSt = parseInt('0');
var max = Math.max(iamtot,gamtot);
var grt = (parseInt(max) + parseInt(UtSt))/2;
var grt = grt.toFixed(2);
document.getElementById('grntot'+obj).value = grt;
var per = (parseInt(grt)/20)*100;
document.getElementById('percent'+obj).value = per;
var Grade;
if( parseInt(per) >= 90 ){
Grade = "A1";
}
else if( parseInt(per) >= 80 ){
Grade = "A2";
}
else if( parseInt(per) >= 70 ){
Grade = "B1";
}
else if( parseInt(per) >= 60 ){
Grade = "B2";
}
else if( parseInt(per) >= 50 ){
Grade = "C1";
}
else if( parseInt(per) >= 40 ){
Grade = "C2";
}
else if( parseInt(per) >= 33 ){
Grade = "D";
}
else if( parseInt(per) >= 21 ){
Grade = "E1";
}
else {
Grade = "E2";
}
document.getElementById('grade'+obj).value = Grade;
}
</script>