현재 Jquery의 Datatable 플러그인으로 완전히 수정 가능한 데이터 테이블을 만들려고합니다. 완전히 수정 가능한 테이블을 사용하면 사용자가 테이블의 열을 편집, 제거, 업데이트, 추가 할 수 있습니다. 예를 바탕으로, 현재 나는 다음과 같은 자바 스크립트 코드를 시도하고있다 :Jquery Datatables 완전히 수정 가능한 데이터 테이블
function var_dump(obj) {
if(typeof obj == "object") {
return "Type: "+typeof(obj)+((obj.constructor) ? "\nConstructor: "+obj.constructor : "")+"\nValue: " + obj;
} else {
return "Type: "+typeof(obj)+"\nValue: "+obj;
}
}//end function var_dump
var oTable;
var giRedraw = false;
var giCount=11;
$(document).ready(function() {
/* Add a click handler to the rows - this could be used as a callback */
$("#example tbody").click(function(event) {
$(oTable.fnSettings().aoData).each(function(){
$(this.nTr).removeClass('row_selected');
});
$(event.target.parentNode).addClass('row_selected');
});
/* Add a click handler for the delete row */
$('#delete').click(function() {
var anSelected = fnGetSelected(oTable);
var iRow = oTable.fnGetPosition(anSelected[0]);
oTable.fnDeleteRow(iRow);
});
oTable = $('#example').dataTable({
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "lib/server_processing.php",
"fnDrawCallback": function() {
$('#example tbody td').editable('lib/editable_ajax.php', {
"callback": function(sValue, y) {
alert(sValue);
/* Redraw the table from the new data on the server */
oTable.fnDraw();
},
"height": "14px"
});
}
});
});
function fnClickAddRow() {
oTable.fnAddData([
giCount+".1",
giCount+".2",
giCount+".3",
giCount+".4",
giCount+".5", ]
);
giCount++;
}
/* Get the rows which are currently selected */
function fnGetSelected(oTableLocal)
{
var aReturn = new Array();
var aTrs = oTableLocal.fnGetNodes();
for (var i=0 ; i<aTrs.length ; i++)
{
if ($(aTrs[i]).hasClass('row_selected'))
{
aReturn.push(aTrs[i]);
}
}
return aReturn;
}
이 사용자 인터페이스에서 잘 작동하지만 내가 서버 측에 열 정보를 전송하는 방법에 대한 아무 생각이 없습니다. 좋아, 난 열의 새로운 가치를 server_ajax 스크립트에 보낼 수 있지만 어떻게 데이터베이스에 편집 된 열의 고유 ID와 같은 열에 대한 다른 관련 정보를 보낼 수 있습니다.
사실 나는이 문제를 이미 해결했지만이 스레드를 닫는 것을 잊었습니다. 그러나 당신의 대답이 합리적이기 때문에, 나는 당신을 찬성합니다. – systemsfault