2017-05-06 64 views
0

這是我的JavaScript函數。使用Javascript/AJAX中的GetElementById無法獲取表格數據

var ajaxRequest = new XMLHttpRequest; 
ajaxRequest.open("GET", "crudops.aspx?StudentId="+id+"&StudentName="+name+"&operation=insert", false); 
ajaxRequest.send(null); 
document.getElementById("TableDiv").innerHTML = ajaxRequest.responseText; 
var t = document.getElementById("TableDiv").innerHTML; 
alert(t); 
var row = table.insertRow(0); 
var cell1 = row.insertCell(0); 
var cell2 = row.insertCell(1); 
cell1.innerHTML = id; 
cell2.innerHTML = name; 

這裏是裏面有什麼t。

<table id="studenttable" cellpadding="5"><tbody><tr><th>Student Id</th><th>Student Name</th> ... </table> 

但我無法讀取表到使用類似

var table = t.getElementbyId("studenttable"); 

如何讀取表,並追加行的變量? 幫我提建議。

+0

您能得到什麼,如果你'的console.log(ajaxRequest.responseText);'? – caramba

+0

整個'TableDiv' HTML代碼@caramba –

+0

'var row = table.insertRow(0);'什麼是'table'?你只有't',而不是'table'。 'innerHTML'也返回一個字符串! –

回答

0
var t = document.getElementById("TableDiv").innerHTML; 
var table = t.getElementById("studenttable"); 

t varible shoud是一個元素,而不是一個字符串。嘗試刪除.innerHTML;

0

字母「d」需要大寫。

var table = t.getElement B yId(「studenttable」);

0

由於異步請求的需要分配一個回調函數來處理響應數據,而不是期待的迴應立即

var xhr = new XMLHttpRequest; 
xhr.onreadystatechane=function(){ 
    if(xhr.readyState==4 && xhr.status==200){ 

     document.getElementById("TableDiv").innerHTML = xhr.response; 
     var t = document.getElementById("TableDiv").innerHTML; 
     alert(t); 

     var row = table.insertRow(0); 
     var cell1 = row.insertCell(0); 
     var cell2 = row.insertCell(1); 

     cell1.innerHTML = id; 
     cell2.innerHTML = name;  

    } 
}; 
xhr.open("GET", "crudops.aspx?StudentId="+id+"&StudentName="+name+"&operation=insert", true); 
xhr.send(null); 
+0

我還沒有注意到使用「false」作爲同步標誌 – RamRaider

0
  • 設置XHR性質asynctrue(或者你可以省略)
  • 使用onreadystatechange回調
  • 不要innerHTML指DOM元素使用DOM節點元素對象,而不是

jsBin live demo

var id = "123", 
    name = "This Is A Name"; 


var XHR = new XMLHttpRequest(), 
    method = "GET", 
    url = "crudops.aspx?StudentId="+id+"&StudentName="+name+"&operation=insert"; 

XHR.open(method, url, true); // << or omit async (anyway defaults to true) 

XHR.onreadystatechange = function() { 
    if(XHR.readyState === XMLHttpRequest.DONE && XHR.status === 200) { 

    document.getElementById("TableDiv").innerHTML = XHR.responseText; 

    // Use meaningful var names 
    // var tableWrapper = document.getElementById("TableDiv").innerHTML; 

    // BTW since at this point your table is (hopefully) in the DOM 
    // you can go get it directly 
    var table = document.getElementById("studenttable"); 

    if(!table) return; // Do nothing if no such Element in DOM 

    var row = table.insertRow(0); 
    var cell1 = row.insertCell(0); 
    var cell2 = row.insertCell(1); 
    cell1.innerHTML = id; 
    cell2.innerHTML = name; 

    } 
}; 

XHR.send(); 

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/open

相關問題