如何在生成的javascript表中包含标题?

时间:2017-11-08 14:36:12

标签: javascript ajax

我在javascript中收到一个json数据,它将转换为html表。

脚本正在运行..但如何在表格中添加标题?

以下是代码:

<script>
        $(document).ready(function(){
            $('#id_adv').DataTable();
            $('#id_adv').on('click','.btn',function(){
                var currow = $(this).closest('tr');
                var result = currow.find('td:eq(1)').text();

                $.get('{% url "prop_table" %}', {var1:result}, function (data_prop) {
                    var data = data_prop['data_prop']       
                    var data_json = JSON.parse(data);
                    var html = "";
                    for (var i = 0; i < data_json.length; i++) {
                        html +=  "<tr><td>" + data_json[i].fields.var1 + "</td><td>" + data_json[i].fields.var2 + "</td><tr>";
                        }
                    $('#id_prop').html(html);                      
                })
                document.getElementById('total').innerHTML = result;                    
            });
        });
    </script>

2 个答案:

答案 0 :(得分:0)

对现有代码进行轻微修改以添加标头。 (我已经删除了你对eval的使用,并保留在相关部分以创建HTML表头)

<script>
        ....
                    var html = "";
                    html +=  "<tr><th>Header 1</th><th>Header 2</th><tr>";
                    for (var i = 0; i < data_json.length; i++) {
                        html +=  "<tr><td>" + data_json[i].fields.var1 + "</td><td>" + data_json[i].fields.var2 + "</td><tr>";
                        }
                    $('#id_prop').html(html);                      
        ....
</script>

这应该为您的表添加标题。 我同意你的问题中的评论,使用内置的JSON解析。 eval只是要求被剥削。

答案 1 :(得分:0)

我认为你可以在创建表后添加标题。 createTHead()方法创建一个空元素并将其添加到表中。即:

<script>
    function createHeader() {
        var table = document.getElementById("myTable");
        var header = table.createTHead();
        var row = header.insertRow(0);
        var cell = row.insertCell(0);
        cell.innerHTML = "<b>This is a table header</b>";
    }
</script>