JQuery создать HTML-таблицу из нескольких SQL выбор - PullRequest
0 голосов
/ 17 марта 2012

У меня мобильное приложение, и у меня возникла следующая проблема.

Я выбираю несколько значений из двух таблиц и пытаюсь создать одну из этих таблиц. Вот мой код:

    list.append('<table class="tablesorter">');
    list.append('<thead><tr><th>Building</th><th>Reason</th><th>Receipt</th><th>Amount</th></tr></thead><tbody>');

    for (j = 0; j < lenpay; j += 1) {
        dummy1(j);
    }

    for (i = 0; i < len; i += 1) {
        dummy(i);
    }

    list.append('</tbody></table>');

dummy и dummy1 - это функции, которые выбирают данные из таблицы и строят строки для таблицы html

function dummy(i){
    selectsql......

    list.append('<tr><td>' + data A + '</td><td>' + data B + '</td><td>' + data C + '</td><td><font color="blue">' + data D + '</font></td></tr>');
}

и

function dummy(i){
    selectsql......

    list.append('<tr><td>' + DATA A + '</td><td>' + DATA B + '</td><td>' + DATA C + '</td><td><font color="blue">' + DATA D + '</font></td></tr>');
}

Результатом является просмотр таблицы в формате html, но если проверить ее с помощью firebug, таблица будет разбита. Так что я не могу отсортировать его по столбцу. Что я делаю не так?

Как мне создать правильную HTML-таблицу?

1 Ответ

2 голосов
/ 17 марта 2012

Ваш стол сломан, потому что вы используете его неправильно. Когда вы делаете это:

list.append('<table class="tablesorter">');

Вы уже добавляете <table></table>, включая закрывающий тег, даже если он не указан. Затем вы делаете это, который добавляет еще один закрывающий тег ...

list.append('</tbody></table>');

Используйте append() с полными объектами, а не с элементами разметки. И, если возможно, добавьте все, наконец. Хорошим подходом является использование строковой переменной, в которую вы помещаете всю разметку, а затем просто ОДИН append() вызов. Также не используйте <font>, это устарело навсегда. Я не могу попробовать это, но вы поняли:

var html = '',
    items = [];


function dummy(i) {
    selectsql......

    items.push('<tr><td>' + data A + '</td>'+
                '<td>' + data B + '</td>'+
                '<td>' + data C + '</td>'+
                '<td><span class="blue">' + data D + '</span></td></tr>');
}

html += '<table class="tablesorter">' +
        '<thead>'+
        '<tr>'+
        '<th>Building</th>'+
        '<th>Reason</th>'+
        '<th>Receipt</th>'+
        '<th>Amount</th>'+
        '</tr>'+
        '</thead>'+
        '<tbody>'+
        items.join('') +
        '</tbody></table>';

list.append(html);
...