2013-04-11 49 views
0

我有一個sqlite表與這些列: |日期|重量| bmi |心情|等jquery基於數據庫記錄添加列

我想要一個表我的HTML頁面的HTML頁面上顯示是這樣的:

<table> 
    <caption></caption> 
    <thead> 
     <tr> 
       <td>(empty cell over row headings)</td> 
       Additional tH's as needed (this is where each date entry goes) 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
       <th scope="row">Weight</th> 
       additional tD's as needed (this is where each weight entry goes matched with date in column heading) 
     </tr> 
     <tr> 
       <th scope="row">BMI</th> 
       additional tD's as needed (same as above) 
     </tr> 
    </tbody> 
</table> 

所以基本上我翻轉顯示目的的行和列。這一切都可以使用jQuery Visualize插件在日期推進時熄滅。正如你所想象的那樣,隨着時間的推移,更多的條目將被添加到顯示錶的列中。這是我迄今一直在搞的(不包括圖表腳本)。我已經弄糊塗了,現在我只是一個爛攤子... 任何建議將是一個很大的幫助。當我嘗試將數據插入一個也試圖插入數據的表中時,我想我遇到了問題。我可能會打賭這個錯誤。因爲它似乎是一個問題,很多人必須碰上 感謝 邁克

function homeSuccess(tx, results) { 
    // Gets initial count of records in table... 
    var entries = results.rows.length; 
    // Iterates over all the existing records... 
    for (var i = 0; i < entries; ++i) { 
     // The following element id's can be found in the div's within the table below, see element.innerHTML line... 
     var element = document.getElementById('colDate'); 
     element.innerHTML += '<th scope="col">' + results.rows.item(i).timeStamp + '</th>'; 
     var element2 = document.getElementById('tdWeight'); 
     element2.innerHTML += '<td>' + results.rows.item(i).weight + '</td>'; 
     var element3 = document.getElementById('tdBmi'); 
     element3.innerHTML += '<td>' + results.rows.item(i).bmi + '</td>'; 
    }; 
    // 'screenView2 is a placeholder on the main html page... 
    var element = document.getElementById('screenView2'); 
    element.innerHTML = '<br /><br /><h1>Data:</h1><br />Number of entries: ' + entries + '<br />' + '<table><caption>Mikes Health</caption><thead><tr><td></td><div id="colDate"></div></tr></thead><tbody><tr><th scope="row">Weight</th><div id="colWeight"></div></tr><tr><th scope="row">BMI</th><div id="colBmi"></div></tr></tbody></table>'; 

    // This section is just a test trying to plug in static elements prior to trying database data... When using this section I had the iteration section commented out. 
    var element2 = document.getElementById('colDate'); 
    element2.innerHTML = '<th scope="col">4-1-13</th>'; 

    var element3 = document.getElementById('colWeight'); 
    element3.innerHTML = '<td scope="col">123</td>'; 

    var element4 = document.getElementById('colBmi'); 
    element4.innerHTML = '<td scope="col">321</td>'; 
} 

function homeQuery(tx) { 
    console.log("entering homeQuery"); 
    tx.executeSql('SELECT * FROM HEALTHGRAPH', [], homeSuccess, onSqlError); 
    console.log("leaving homeQuery"); 
} 

// Function that is called on initial page load 
function homeDBopen() { 
    console.log("opening db for home data"); 
    theDB = window.openDatabase("hgDB", "1.0", "HealthGraph", 3 * 1024 * 1024); 
    theDB.transaction(homeQuery, onTxError, onTxSuccess); 
    console.log("leaving homeDBopen"); 
} 

回答