0

好的..我正在为我的部门设计一个网络应用程序,讲师可以在其中输入他/她正在学习的课程的结果。我已经使用 java-script 表成功创建了接口;之后,我希望将表的内容发布到我使用 MySQL 设计的数据库中

关于如何做到这一点的任何想法!

这是javascript代码片段

<script type="text/JavaScript">

function addRowToTable()
{
var tbl = document.getElementById('tblResultSample');
var lastRow = tbl.rows.length;
// if there's no header row in the table, then iteration = lastRow + 1

var iteration = lastRow;
var row = tbl.insertRow(lastRow);

// left cell
var cellLeft = row.insertCell(0);
var textNode = document.createTextNode(iteration);
cellLeft.appendChild(textNode);

// right cell
var cellRight = row.insertCell(1);
var el = document.createElement('input');
el.type = 'text';
el.name = 'Student_ID' + iteration;
el.id = 'Student_ID' + iteration;

el.size = 30;

el.onkeypress= keyPressTest;
cellRight.appendChild(el);  

//CA cell
var caCell = row.insertCell(2);
var el1 = document.createElement('input');
el1.type = 'text';
el1.name = 'caScore' + iteration;
el1.id = 'caScore' + iteration;
el1.size = 5;
el1.onchange= fncSum;

el1.onkeypress= keyPressTest;
caCell.appendChild(el1);


//Exam cell
var examCell = row.insertCell(3);
var el2 = document.createElement('input');
el2.type = 'text';
el2.name = 'examScore' + iteration;
el2.id = 'examScore' + iteration;
el2.size = 7;
el2.onchange= fncSum;
el2.onkeypress= keyPressTest;
examCell.appendChild(el2);

//total cell
var totalCell = row.insertCell(4);
var el3 = document.createElement('input');
el3.type = 'text';
el3.name = 'totalScore' + iteration;
el3.id = 'totalScore' + iteration;

el3.size = 7;

el3.onkeypress= keyPressTest;
totalCell.appendChild(el3);

//grade cell
var gradeCell = row.insertCell(5);
var el5 = document.createElement('input');
el5.type = 'text';
el5.name = 'gradeScore' + iteration;
el5.id = 'gradeScore' + iteration;
//  el5.onchange=changeValue;
el5.size = 7;
el5.onkeypress= keyPressTest;
gradeCell.appendChild(el5);



//gpp cell
var gppCell = row.insertCell(6);
var el4 = document.createElement('input');
el4.type = 'text';
el4.name = 'gppScore' + iteration;
el4.id = 'gppScore' + iteration;
el4.size = 7;

el4.onkeypress= keyPressTest;
gppCell.appendChild(el4);

}

function keyPressTest(e, obj)
{
var validateChkb=document.getElementById('chkValidateOnKeyPress');
if(validateChkb.checked){
    var displayObj=document.getElementById('spanOutput');
    var key;
    if(window.event){
        key=window.event.keyCode;
    }
    else if(e.which) {
        key=e.which;
    }
    var objId;
    if(obj != null){
        objId=obj.id;
    }else{
        objId=this.id;
    }
    displayObj.innerHTML= objId+ ' : ' + String.fromCharCode(key);
}
 }

 function removeRowFromTable()
 {
 var tbl = document.getElementById('tblResultSample');
 var lastRow = tbl.rows.length;
 if (lastRow > 2) tbl.deleteRow(lastRow - 1);
}


//takes the values of C.a and Exam to calculate total score
 function fncSum()
{

 var tbl = document.getElementById('tblResultSample');
 var lastRow = tbl.rows.length;
 // if there's no header row in the table, then iteration = lastRow + 1
 var i = lastRow;

    for(i=1; i<=lastRow; i++) {
     if(isNaN(document.getElementById('caScore'+i).value))
     {
        alert('(CA Score)Please input Number only.');
        document.getElementById('caScore'+i).focus();
        return;
     }

     if(isNaN(document.getElementById('examScore'+i).value))
     {
        alert('(Exam Score required Please input Number only.');
        document.getElementById('examScore'+i).focus();
        return;
     }

   document.getElementById('totalScore'+i).value=   parseFloat(document.getElementById('caScore'+i).value) + parseFloat(document.getElementById('examScore'+i).value);

var crsUnit= parseFloat(document.getElementById('cUnit').value);


if(document.getElementById('totalScore'+i).value >=70)
{ 
document.getElementById('gradeScore'+i).value= 'A';
document.getElementById('gppScore'+i).value= 5* crsUnit;
}

if(document.getElementById('totalScore'+i).value >=65 &&   document.getElementById('totalScore'+i).value <70)
 { 
 document.getElementById('gradeScore'+i).value= 'B+';
 document.getElementById('gppScore'+i).value= 4.5* crsUnit;
 }

if(document.getElementById('totalScore'+i).value >=60 &&  document.getElementById('totalScore'+i).value <65)
 { 
 document.getElementById('gradeScore'+i).value= 'B';
 document.getElementById('gppScore'+i).value= 4* crsUnit;
}

 if(document.getElementById('totalScore'+i).value >=55 && document.getElementById('totalScore'+i).value <60)
{ 
 document.getElementById('gradeScore'+i).value= 'C+';
document.getElementById('gppScore'+i).value= 3.5* crsUnit;
}

 if(document.getElementById('totalScore'+i).value >=50 && document.getElementById('totalScore'+i).value <55)
{ 
document.getElementById('gradeScore'+i).value= 'C';
document.getElementById('gppScore'+i).value= 3* crsUnit;
}

if(document.getElementById('totalScore'+i).value >=45 &&   document.getElementById('totalScore'+i).value <50)
{ 
document.getElementById('gradeScore'+i).value= 'D';
document.getElementById('gppScore'+i).value= 2* crsUnit;
}

if(document.getElementById('totalScore'+i).value >=40 && document.getElementById('totalScore'+i).value <45)
{ 
document.getElementById('gradeScore'+i).value= 'E';
document.getElementById('gppScore'+i).value= 1* crsUnit;
}

else if(document.getElementById('totalScore'+i).value <40)
{ 
document.getElementById('gradeScore'+i).value= 'F';
document.getElementById('gppScore'+i).value= 0* crsUnit;
}   

    }
}



function validateRow()
{
var chkb=document.getElementById('chkValidate');
if (chkb.checked){
    var tbl=document.getElementById('tblResultSample');
    var lastRow=tbl.rows.length - 1; //returns the number of rows in the table
    var i;

    for(i=1; i<=lastRow; i++) {
        var aRow= document.getElementById('Student_ID'+i);

        if(aRow.value.length <= 0) {
            alert('Student ID '+i+' is empty');
            aRow.focus();
            return;
        }

        var caCell=parseInt(document.getElementById('caScore'+i).value);

            if(isNaN(caCell))
            {
                alert('CA for Student ID '+i+' is not valid');
                document.getElementById('caScore'+i).focus();
                return;
            }

                else if(caCell>30)
                {
                    alert('CA for Student ID '+i+' is above  30'); 
document.getElementById('caScore'+i).focus();
                    return;
                    }

var examCell=parseInt(document.getElementById('examScore'+i).value);
if(isNaN(examCell))
{
alert('Exam Score for Student ID '+i+' is not valid');
return;
}

else if(examCell>70)
{
alert('Exam for Student ID '+i+' is above 70'); 
return;
}


}

}       

else {
alert('Please ensure you check the validate Entry before submitting the result');
}
}


</script>

为他/她的学生输入成绩后;然后将动态表的内容发布到 MySQL 表中。这是生成的表应该是这样的......

idNumber    Marks   Grade   Gpp     
06/05/02/001    39  F   0   
    06/05/02/001    46  D   4   
    06/05/02/001    56  C+  7   
    06/05/02/001    78  A   5   
4

2 回答 2

1

“我已经使用 java-script 表成功创建了接口;” 不,您的表格是由 Javascript 生成的 HTML 表格。完全不一样。

您可以使用 AJAX 或表单发布您的数据。阅读内容和内容以获取更多信息。

于 2013-04-12T00:19:40.267 回答
0

您需要遵循几个步骤-

  • 建立表格后,在 javascript 中编写一个方法,该方法采用此表格元素并返回一个 JSON 对象,该对象将被发送回您的服务器。简单的 JS 代码将在这里展开。

  • 您将收到您在 PHP 脚本中发布的数据。使用此示例 PHP 代码进行 DB 交互。将您的数据存储到 mySql 表中。

于 2013-04-12T00:45:54.753 回答