DataTables의 단일 td에 둘 이상의 값을 추가 하시겠습니까?

Question

텍스트 입력을 통해 Datatables에 정보를 추가하려고합니다.

$('.home').dataTable().fnAddData([ 
    $("#fName").val(), 
    $("#lName").val() 
]); 

을하지만 문제는 내가 같은 TD 아닌 다른 TDS 이러한 입력의 양의 값을 필요로한다는 것입니다 : 일반적으로, 당신과 같이, fnAddData과 DataTables에 추가 할 수 있습니다. 의 라인을 따라 뭔가 :

$('td:first').text($("#fName").val() + ' ' + $("#lName").val()); 

... 난 그냥 DataTables에 추가 할 제대로 그것에 대해 이동하는 방법을 모르겠어요. 테이블에 정보를 추가했음을 알 수 있지만, 페이지 매김을 추가하지 않으며 DataTables에 올바르게 추가하지 않습니다. 어떤 아이디어? 미리 감사드립니다.

http://jsfiddle.net/Z85QC/3/

Answer 1

당신은 fnAddData 메서드에 전달 된 첫 번째 배열 항목으로 성과 이름의 값을 가입 할 수 있습니다. 각 배열 항목은 테이블의 열을 나타냅니다. http://jsfiddle.net/Z85QC/4/

Answer 2

내가 자바 스크립트 배열을 사용하여 다른 접근 방식을 추천 수 :

$('#example').dataTable().fnAddData([ 
    $("#fName").val() + $("#lName").val(), 
    $("#email").val(), 
    $("#company").val() + '<br>' + $('#address').val() 
]); 

현재 작업 버전을 참조하십시오? 샘플에서

는 HTML 테이블이된다 :

var thedata = [ 
    { 
     name: "John Smith", 
     email: "jsmith@company.com", 
     address: "Company\n123 Seseme Street\nHouston, TX 77388 USA" 
    }, 
    { 
     name: "Jane Doe", 
     email: "jdoe@company.com", 
     address: "Company\n123 Seseme Street\nHouston, TX 77388 USA" 
    } 
]; 

var thetable = $('#example').dataTable({ 
    aaData: thedata, 
    aoColumns: [ 
     { sTitle: "Name", mData: "name" }, 
     { sTitle: "Email", mData: "email" }, 
     { sTitle: "Address", mData: "address", sClass: "address"} 
    ] 
}); 

$('#addRow').click(function() { 
    thetable.fnAddData({ 
     name: $("#fName").val() + ' ' + $("#lName").val(), 
     email: $("#email").val(), 
     address: $("#company").val() + '\n' + $("#address").val() 
    }); 
}); 

참고 다른를 만들 수 있습니다

<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"></table> 

당신은 어떤 CSS 규칙

td.address 
{ 
    white-space: pre 
} 

그리고 코드가 필요 개체 및 일부 데이터를 mergin 각 열에 대한 렌더링 함수를 사용하지만, 대답을 위해, 나는 이것으로 충분하다고 생각합니다.