2016-06-08 87 views
0

因此,我正在研究一種可讓我添加基本學生信息並將其添加到表格的成績冊。我的問題是:我無法將提交的信息顯示在桌面上。使用表格添加表格數據javascript使用表格

https://jsfiddle.net/20gs4xh2/

function submit(){ 
var firstName = document.getElementById('firstName').value 
var lastName = document.getElementById('lastName').value 
var finalGrade = document.getElementById('finalGrade').value 
var submit = new student(firstName, lastName, finalGrade); 
studentdata.addstudenttotable(submit); 
resetEntries(); 
updateGradebook(); 
} 
function updateGradebook(){ 
document.getElementById('tbody').innerHTML = ''; 

studentdata.data.forEach(function(elm){ 
    var row = document.createElement('tr') 
    row.innerHTML = "<td>" + elm.firstName + "</td><td>" + elm.lastName + "</td><td>" + elm.finalGrade +"% </td>" 
    document.getElementById('tbody').appendChild(row); 
}) 
+0

你允許使用jQuery嗎? – chungtinhlakho

+0

是的,我可以使用jQuery。 – JHillman

+0

您的submit()函數沒有被調用,因爲按鈕上的submit()會啓動表單提交。您需要先更改該函數的名稱。然後我看到你正在做一個「新生」,但沒有定義「學生」原型。你也沒有初始化'studentdata',但你正在使用它。你的代碼有很多問題。 – phreakv6

回答

0

。請記住,類型按鈕的默認操作是提交帖子或獲取。所以,如果你不想這樣做,你必須做event.stopProgagation()。不使用jQuery,我相信你可以做onclick="function(); return false"https://jsfiddle.net/50tskqtu/

$(document).ready(function() { 

    $('#btnSubmit').click(function(event) { 
     event.stopPropagation(); //stop the default behavior of type button 
     var row = $('<tr></tr>') 
     row.append('<td>'+$('#firstName').val()+'</td>') 
     row.append('<td>'+$('#lastName').val()+'</td>') 
     row.append('<td>'+$('#finalGrade').val()+'</td>') 
     $('#tbody').append(row) 
    }); 


}); 
0

使用jQuery給你的表 'CUSTOMER_DATA' 的標識

function submit(){ 
       var table = document.getElementById('customer_data'); 
       var row = document.createElement('tr'); 
       var td1 = document.createElement('td'); 
       var td2 = document.createElement('td'); 
       var td3 = document.createElement('td'); 

       td1.innerHTML = document.getElementById('firstName').value; 
       td2.innerHTML = document.getElementById('lastName').value; 
       td3.innerHTML = document.getElementById('finalGrade').value; 

       row.appendChild(td1); 
       row.appendChild(td2); 
       row.appendChild(td3); 

       table.children[0].insertBefore(row, table.children[0].childNodes[1]); 

       resetEntries(); 
      }