2012-03-16 4 views
0

모바일 앱이 있는데 다음과 같은 문제가 있습니다.jQuery 다중 sqlite 선택에서 html 테이블 만들기

두 테이블에서 일부 값을 선택하고이 선택 항목에서 하나의 테이블을 만들려고합니다.

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>'); 

더미와 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>'); 
} 

결과는이다 여기에 내 코드 table look html 그러나 방화범이 끌려 가면 테이블이 손상됩니다. 그래서 나는 그것을 열로 정렬 할 수 없다. 내가 뭘 잘못하고 있니?

어떻게하면 올바른 html 테이블을 만들 수 있습니까?

+0

데이터에있는 어떤 것이 추가 코드를 깨뜨린다. 데이터에 html 요소가 포함되어 있습니까? – Panagiotis

+0

일부 데이터를 표시하기 위해 (#div) .html (blabla)을 사용합니다 ... – kosbou

답변

2

테이블을 잘못 사용했기 때문에 테이블이 손상되었습니다. 이 작업을 수행 할 때 :

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); 
관련 문제