1數組顯示在2個單獨的表格中

Question

我有1個數組，並希望在2個獨立的表格上顯示它。結果是2個表合併爲一個。

第二個表顯示，但第二個表中沒有數據。

請幫忙。由於

Live Code

HTML

<table id="myTable" border="1" width="300" cellpadding="5"> 

    </table> 
<p> </p> 
    <table id="myTable1" border="1" width="300" cellpadding="5" border="1" bordercolor="#cc0000"> 

    </table> 

JS

var dateList =[ 
    { 
     name: "Mike Jenson", 
     email: "mike_j@yesware.com", 
     phone: "9433550193", 
     joined: "05/23/2014", 
    }, 
    { 
     name: "Jim Stevens", 
     email: "jim_s@yesware.com", 
     phone: "1299331944", 
     joined: "05/22/2014" 
    }, 
    { 
     name: "Paul Smith", 
     email: "paul_s@yesware.com", 
     phone: "4351289654", 
     joined: "04/14/2014" 
    }, 
    { 
     name: "Sarah Andrews", 
     email: "sarah_a@yesware.com", 
     phone: "1299332944", 
     joined: "03/15/2014" 
    }, 
    { 
     name: "Edward O'Brien", 
     email: "edward_ob@yesware.com", 
     phone: "4782456897", 
     joined: "03/27/2014" 
    }, 
    { 
     name: "Nicole Plano", 
     email: "nicole_p@yesware.com", 
     phone: "6657831564", 
     joined: "03/30/2013" 
    }, 
    { 
     name: "Peter Min", 
     email: "peter_m@yesware.com", 
     phone: "8893923938", 
     joined: "01/07/2013" 
    }, 
    { 
     name: "Aaron Jackson", 
     email: "aaron_j@yesware.com", 
     phone: "6174896315", 
     joined: "04/11/2014" 
    } 
    ]; 

     $("#myTable").html(""); 
     for (var i=0; i< dateList.length; i++) 
     { 
      var tr="<tr>"; 
      var td1 = "<td>" + dateList[i]["name"] + "</td>"; 
      var td2 = "<td>" + dateList[i]["email"] + "</td>"; 
      var td3 = "<td>" + dateList[i]["phone"] + "</td>"; 
      var td4 = "<td>" + dateList[i]["joined"] + "</td></tr>"; 
      $('#myTable').append(tr+td1+td2+td3+td4); 
     } 

    $("#myTable1").html(""); 
     for (var i=0; i< dateList.length; i++) 
     { 
      var tr="<tr>"; 
      var td1 = "<td>" + dateList[i]["name"] + "</td>"; 
      var td2 = "<td>" + dateList[i]["email"] + "</td>"; 
      var td3 = "<td>" + dateList[i]["phone"] + "</td>"; 
      var td4 = "<td>" + dateList[i]["joined"] + "</td></tr>"; 
      $('#myTable').append(tr+td1+td2+td3+td4); 
     } 

Answer 1

因爲你必須在第二個for循環一個錯字要設置#myTable代替#myTable1

$("#myTable1").html(""); 
    for (var i=0; i< dateList.length; i++) 
    { 
     var tr="<tr>"; 
     var td1 = "<td>" + dateList[i]["name"] + "</td>"; 
     var td2 = "<td>" + dateList[i]["email"] + "</td>"; 
     var td3 = "<td>" + dateList[i]["phone"] + "</td>"; 
     var td4 = "<td>" + dateList[i]["joined"] + "</td></tr>"; 
     $('#myTable1').append(tr+td1+td2+td3+td4); // HERE 
     // --------^ you need to make it myTable1 
    }