2017-06-26 26 views
0

我想動態地使用表列中的值購買一些複選框。當表創建它應該如何(我使用對我的服務器的get請求動態填充它)時,我無法從任何列中獲取值,因此我可以使用它們。這裏是我的代碼:JQuery:無法從表列中獲取元素

$(document).ready(function() 
{ 
/* 
$.get("sub3",function(responseJson) 
{ 
    if(responseJson!=null) 
    { 
     $("#table1").find("tr:gt(0)").remove(); 
     var table1 = $("#table1"); 
     $.each(responseJson, function(key,value) { 
      var rowNew = $("<tr><td></td><td></td><td></td><td></td></tr>"); 
      rowNew.children().eq(0).text(value['idp']); 
      rowNew.children().eq(1).text(value['producator']); 
      rowNew.children().eq(2).text(value['culoare']); 
      rowNew.children().eq(3).text(value['pret']); 
      rowNew.appendTo(table1); 
     }); 
    } 
}); 
*/ 

var xmlhttp = new XMLHttpRequest(); 
xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == XMLHttpRequest.DONE) { 
     if (xmlhttp.status == 200) 
     { 
      $("#table1").find("tr:gt(0)").remove(); 
      var table1 = $("#table1"); 
      var Data = JSON.parse(xmlhttp.responseText); 
      $.each(Data, function(key,value) { 
       var rowNew = $("<tr><td></td><td></td><td></td><td></td></tr>"); 
       rowNew.children().eq(0).text(value['idp']); 
       rowNew.children().eq(1).text(value['producator']); 
       rowNew.children().eq(2).text(value['culoare']); 
       rowNew.children().eq(3).text(value['pret']); 
       rowNew.appendTo(table1); 
      }); 
     } 
     else if (xmlhttp.status == 400) { 
      alert('There was an error 400'); 
     } 
     else { 
      alert('something else other than 200 was returned'); 
     } 
    } 
}; 

xmlhttp.open("GET", "sub3", true); 
xmlhttp.send(); 

createBox(); 
}); 


function createBox() 
{ 
    var items=[]; 
    $('#table1 tr td:nth-child(2)').each(function() 
    { 
     items.push($(this).text());  
    }); 
    var items = $.unique(items); 
    console.log(items); 
    for (var i = 0; i < items.length; i++) 
    { 
     addCheckbox(items[i]); 
    } 

} 

function addCheckbox(name) 
{ 
    var container = $('#cblist'); 
    var inputs = container.find('input'); 
    var id = inputs.length+1; 

    $('<input />', { type: 'checkbox', id: 'cb'+id, value: name 
}).appendTo(container); 
    $('<label />', { 'for': 'cb'+id, text: name }).appendTo(container); 
} 

在功能createbox(),在執行console.log(項目)打印[],當它應該充滿已添加到我的表中的值。我究竟做錯了什麼?

+2

'createBox()是你的'onreadystatechange'回調之前執行'你xmlhttp.onreadystatechange功能您$。每次通話後開火。所以此時你的桌子是空的 –

回答

1

Move createBox();

xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == XMLHttpRequest.DONE) { 
     if (xmlhttp.status == 200) 
     { 
      $("#table1").find("tr:gt(0)").remove(); 
      var table1 = $("#table1"); 
      var Data = JSON.parse(xmlhttp.responseText); 
      $.each(Data, function(key,value) { 
       var rowNew = $("<tr><td></td><td></td><td></td><td></td></tr>"); 
       rowNew.children().eq(0).text(value['idp']); 
       rowNew.children().eq(1).text(value['producator']); 
       rowNew.children().eq(2).text(value['culoare']); 
       rowNew.children().eq(3).text(value['pret']); 
       rowNew.appendTo(table1); 
      }); 
      createBox(); 
     } 
     else if (xmlhttp.status == 400) { 
      alert('There was an error 400'); 
     } 
     else { 
      alert('something else other than 200 was returned'); 
     } 
    } 
};