2017-04-03 4 views
-1

Von den JSON-Daten versuche ich Werte in der Tabelle von HTML anzuzeigen, aber es schlägt fehl, das gleiche zu tun. Ich bin nicht in der Lage, die error.I've in der folgenden Art und Weise verwendet, um zu erkennen, aber ich kann keine Antwort finden:Anfügen von Zeile im Tabellenkörper mit Skript

<html> 
<head> 
<title>Check</title> 
<meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js"></script> 
<script> 
function getRow(begin,phrase,buggy,words,negative,comma,loos,leng) { 


jQuery('#donut').empty(); 

jQuery(document).ready(function() { 
var nb = begin; 
var bp = phrase; 
var bw = buggy; 
var uw = words; 
var nt = negative; 
var punc = comma; 
var loose = loos; 
Morris.Donut({ 
    element: 'donut', 
    data: [ 
    {value: nb, label: 'Should not begin'}, 
    {value: bp, label: 'Buggy phrase'}, 
    {value: bw, label: 'Buggy word'}, 
    {value: uw, label: 'Useless word'}, 
    {value: nt, label: 'Negative term'}, 
    {value: punc, label: 'Punctuation mistake'}, 
    {value: loose, label: 'Loose sentence'}, 
    {value: 0, label: 'Tense'} 
    ], 
    formatter: function (x) { return x + "%"} 
}).on('click', function(i, row){ 
    console.log(i, row); 
}); 
}); 
} 
</script> 

<script> 

jQuery(document).ready(function() { 

var tab1 = ""; 
var posts = [{"begin": 0, "loose": 1, "leng": 8, "buggy": 0, "negative": 1, "nam": "10.Conclusion and future ", "comma": 5, "words": 1, "date": "2017-04-03 16:08:40", "phrase": 0}, {"begin": 0, "loose": 1, "leng": 11, "buggy": 5, "negative": 1, "nam": "8.Chapter 5.docx", "comma": 5, "words": 0, "date": "2017-04-03 16:06:49", "phrase": 0}, {"begin": 10, "loose": 6, "leng": 280, "buggy": 16, "negative": 12, "nam": "7.Chapter 4.docx", "comma": 194, "words": 2, "date": "2017-04-03 12:11:23", "phrase": 0}, {"begin": 1, "loose": 2, "leng": 20, "buggy": 5, "negative": 6, "nam": "eunoia", "comma": 4, "words": 3, "date": "2016-12-20 12:33:40", "phrase": 4}]; 


jQuery(posts).each(function(i,f){ 
alert(f.leng); 
    var dt = f.date.split(" "); 
    var tblRow = "<tr role=\"row\">" + "<td onclick=\"getRow(" +f.begin,f.phrase,f.buggy,f.words,f.negative,f.comma,f.loose,f.leng+")\">" + f.nam +"<td>" + dt[0] + "</td>" + "<td>" + dt[1] + "</td>" + "</tr>"; 
     tab1 += tblRow; 


    });  
      jQuery(tab1).appendTo("#example tbody"); 

}); 
</script> 
</head> 


<body> 

      <table id="example" style="width: 100%; border: 1px solid black"> 
       <thead> 
        <tr role="row"> 
         <th rowspan="1" colspan="1" style="width: 150px;">File Name</th> 
         <th rowspan="1" colspan="1" style="width: 109px;">Date</th> 
         <th rowspan="1" colspan="1" style="width: 82px;">Time</th> 
        </tr> 
       </thead> 
       <tbody> 

       </tbody> 
      </table> 

</body> 
</html> 

Von den json Daten Ich versuche, Werte in der Tabelle von HTML angezeigt werden, aber es macht nicht dasselbe. Ich kann den Fehler nicht erkennen.

+0

'posts [i] .leng' kann ein Problem sein - vorausgesetzt, Sie versuchen, die Anzahl der Elemente im Array zu erhalten, sollte es" Länge "sein. Sie tun auch viele unnötige String-Verkettung, z. '" "+"

+0

nicht gefunden werden kann Können Sie den HTML-Code hinzufügen? – Alok

+0

Was hast du bekommen? wie es nicht funktioniert? –

Antwort

0

Es war ein Fehler anhängen in I als

geschrieben haben sollte

"td Onclick = \" getRow ("+ f.begin +", "+ f.phrase +", "+ f.buggy +", "+ f.wörter +", "+ f.negativ +", "+ f.comma +", "+ f.loose +", "+ f.leng +") \ „>

hier sollte auch als String trated werden.

-1

Sie können Tabellenzeile wie unten,

function table_element(posts) { 
for (i = 0; i < posts.length; i++) {   
    if (i % 2 == 0) { 
    var t1= "<tr class=\"even\" role=\"row\">" + "<td onclick=\"getRow(" + posts[i].begin, posts[i].leng + ")\" >" + "</td>" + "<td class=\"\">" + posts[i].nam + "</td>" + "<td class=\"\">" + posts[i].words + "</td>" + "<td class=\"sorting_1\">" + posts[i].date.split(" ")[0] + "</td>" + "<td>" + posts[i].date.split(" ")[1] + "</td>" + "</tr>" 
    $("#example1").append(t1); 
    } else { 
    var t2 = "<tr class=\"odd\" role=\"row\">"+"<td onclick=\"getRow("+posts[i].begin, posts[i].leng+")\">"+"</td>"+"<td class=\"\">" +posts[i].nam+"</td>"+"<td class=\"\">" +posts[i].words+"</td>"+"<td class=\"sorting_1\">" +posts[i].date.split(" ")[0]+"</td>"+"<td>"+posts[i].date.split(" ")[1]+"</td>"+"</tr>" 
    $("#example1").append(t2); 
} 
} 
} 
+0

Während dies zu erarbeiten Code-Snippet kann die Frage lösen, [einschließlich einer Erklärung] (http://meta.stackexchange.com/questions/114762/explaining-entirely-code-based-answers) wirklich hilft, die Qualität Ihres Beitrags zu verbessern. Denken Sie daran, dass Sie die Frage für Leser in der Zukunft beantworten, und diese Leute könnten die Gründe für Ihren Codevorschlag nicht kennen. Bitte versuchen Sie auch nicht, Ihren Code mit erklärenden Kommentaren zu füllen, dies reduziert die Lesbarkeit sowohl des Codes als auch der Erklärungen! –

+0

@Rory McCrossan, danke für deine Erklärung. Er fragte, wie man eine Zeile anfügt, also ändere ich nur den Code und gab –

+1

Alles, was Sie anscheinend geändert haben, ist 'appendTo()' zu 'append()'. Wenn das ehemalige nicht funktioniert, sehe ich nicht, warum das –

Verwandte Themen