通过javascript从数据库中检索数据; jQuery的

时间:2015-01-20 14:06:45

标签: javascript jquery sql database jquery-ui

我有以下代码:

var _this = this,
                $div = _this.$div,
                opts = _this.settings,
                $table = $div.find(opts.tableSelector);

var listaCamposAExibir = ["Identificação Direta", "Identificação Indireta", "Total", "REINCIDÊNCIAS COM IDENTIFICAÇÃO DIRETA", "REINCIDÊNCIAS COM IDENTIFICAÇÃO INDIRETA", "Total", "TOTAL DE IDENTIFICAÇÕES N"];

            var i = 0;

            document.write('<table>')

            for (var j = 0; j < list.length; j++) {
                i = 0;
                for (p in list[j]) {
                    if (p === "Nome") {
                        document.write('<tr>');
                        document.write('<td>' + list[j][p] + '</td><td></td>');
                        document.write('</tr>');
                    } else {
                        if(p === "TotalGeral" && list[j].Nome === "Interior"){
                            document.write('<tr>');
                            document.write('<td>' + listaCamposAExibir[i] + 'O INTERIOR</td><td>' + list[j][p] + '</td>');
                            document.write('</tr>');
                        } else {
                            if(p === "TotalGeral" && list[j].Nome === "Metropolitana"){
                                document.write('<tr>');
                                document.write('<td>' + listaCamposAExibir[i] + 'A CAPITAL</td><td>' + list[j][p] + '</td>');
                                document.write('</tr>');
                            } else {
                                document.write('<tr>');
                                document.write('<td>' + listaCamposAExibir[i] + '</td><td>' + list[j][p] + '</td>');
                                document.write('</tr>');
                                i++;
                            }
                        }                       
                    }
                }
            }

            document.write('<tr><td>TOTAL:</td><td>' + (parseInt(list[0].TotalGeral) + parseInt(list[1].TotalGeral)) + '</td></tr>');

            document.write('</table>')

以下html:

<div class="form-list-result resultadosDaPesquisa hidden">
        <div class="form-list-result-header resultadosDaPesquisa hidden">
            <label>Resultado da Pesquisa</label>
        </div>
        <table class="table" width="100%">
        </table>
    </div>

但是当我点击按钮时,表格继续为空,只有

当我使用document.write时,它曾经出现在表中,如下所示:

Interior    
Identificação Direta                         2
Identificação Indireta                       3
Total                                        5
REINCIDÊNCIAS COM IDENTIFICAÇÃO DIRETA       1
REINCIDÊNCIAS COM IDENTIFICAÇÃO INDIRETA     1
Total                                        2
TOTAL DE IDENTIFICAÇÕES NO INTERIOR          7
Metropolitana   
Identificação Direta                         3
Identificação Indireta                       2
Total                                        5
REINCIDÊNCIAS COM IDENTIFICAÇÃO DIRETA       1
REINCIDÊNCIAS COM IDENTIFICAÇÃO INDIRETA     1
Total                                        2
TOTAL DE IDENTIFICAÇÕES NA CAPITAL           7
TOTAL:                                       14

数据库中的查询结果如下:

Nome            IdDireta IdIndireta SubTotal RIdDireta RIdIndireta RSubTotal  Total
Interior        2        3          5        1         1           2          7
Metropolitana   3        2          5        1         1           2          7

1 个答案:

答案 0 :(得分:0)

您需要将HTML放入字符串中,然后将元素的innerHTML属性设置为该字符串。

试试这个

在html中为您的表添加ID

<div class="form-list-result resultadosDaPesquisa hidden">
    <div class="form-list-result-header resultadosDaPesquisa hidden">
        <label>Resultado da Pesquisa</label>
    </div>
    <table id="mytable" class="table" width="100%">
    </table>
</div>

并将您的javascript更改为此

var _this = this,
    $div = _this.$div,
    opts = _this.settings,
    $table = $div.find(opts.tableSelector);

    var listaCamposAExibir = ["Identificação Direta", "Identificação Indireta", "Total", "REINCIDÊNCIAS COM IDENTIFICAÇÃO DIRETA", "REINCIDÊNCIAS COM IDENTIFICAÇÃO INDIRETA", "Total", "TOTAL DE IDENTIFICAÇÕES N"];

    var i = 0;
    var t = '';
    t += '<table>'

    for (var j = 0; j < list.length; j++) 
    {
        i = 0;
        for (p in list[j]) 
        {
            if (p === "Nome") 
            {
                t += '<tr>';
                t += '<td>' + list[j][p] + '</td><td></td>';
                t += '</tr>';
            } 
            else 
            {
                if(p === "TotalGeral" && list[j].Nome === "Interior")
                {
                    t += '<tr>';
                    t += '<td>' + listaCamposAExibir[i] + 'O INTERIOR</td><td>' + list[j][p] + '</td>';
                    t += '</tr>';
                } 
                else 
                {
                    if(p === "TotalGeral" && list[j].Nome === "Metropolitana")
                    {
                        t += '<tr>';
                        t += '<td>' + listaCamposAExibir[i] + 'A CAPITAL</td><td>' + list[j][p] + '</td>';
                        t += '</tr>';
                    } 
                    else 
                    {
                        t += '<tr>';
                        t += '<td>' + listaCamposAExibir[i] + '</td><td>' + list[j][p] + '</td>';
                        t += '</tr>';
                        i++;
                    }
                }                       
            }
        }
    }

    t += '<tr><td>TOTAL:</td><td>' + (parseInt(list[0].TotalGeral) + parseInt(list[1].TotalGeral)) + '</td></tr>';

    t += '</table>';

    document.getElementById("mytable").innerHTML = t;