0
Datatables 플러그인 (http://www.datatables.net)과 Datatables Editor (http://editor.datatables.net)를 사용하여 일부 테이블 설정이 있습니다.Datatables - 기존 테이블에 편집기 통합
편집기를 기존 테이블에 통합하려고하지만 모든 편집 필드 (팝업)에서 정의되지 않은 상태가됩니다.
내가 가진 것과 발전기 다운로드 사이에 유일한 차이점은 aoColumns 설정입니다.
"aoColumns": [
{ "sTitle": "id" },
{ "sTitle": "Name" },
{ "sTitle": "Surname" },
{ "sTitle": "Email" }
하지만 편집기 코드가 있습니다 :
이 내가 현재 가지고있는 것입니다
"aoColumns": [
{ "mDataProp": "id" },
{ "mDataProp": "Name" },
{ "mDataProp": "Surname" },
{ "mDataProp": "Email" }
나는 "sTitle"에서 "mDataProp"내 테이블에 더 이상 부하를 변경할 때.
분명히 잘못된 방향으로 가고 있습니다 ... 이에 대한 방향은 매우 높이 평가 될 것입니다.
편집 :
여기내 전체 코드입니다 :
<script type="text/javascript">
function fnShowHide(iCol){
/* Get the DataTables object again - this is not a recreation, just a get of the object */
var oTable = jQuery('#example').dataTable();
var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
oTable.fnSetColumnVis(iCol, bVis ? false : true);
}
(function($){
$(document).ready(function() {
var aDataSet = [
var aDataSet = [
['805',
'Emelia',
'Smith',
'[email protected]'
],
['804',
'david',
'Davies',
'[email protected]'
],
];
var editor = new $.fn.dataTable.Editor({
"ajaxUrl": "php/table.wp_newsletter.php",
"domTable": "#example",
"fields": [
{
"label": "First Name",
"name": "name",
"type": "text"
},
{
"label": "Last Name",
"name": "surname",
"type": "text"
},
{
"label": "Email Address",
"name": "email",
"type": "text"
}
]
});
var oTable;
var oTable = $('#example').dataTable({
"sDom": '<"postbox full"<W>><"clear"><"postbox full"<C><T>><"clear"><"postbox full"<lfr>><"clear"><"postbox full"<t>>ip',
"oColumnFilterWidgets": {
"aiExclude": [ 0,1,2,3,6,7,9 ],
},
"iDisplayLength": 50,
"sPaginationType": "full_numbers",
"bSortClasses": false,
"aaData": aDataSet,
"oLanguage": {
"sSearch": "Search all columns:"
},
"oTableTools": {
"sSwfPath": "swf/copy_csv_xls_pdf.swf",
"sRowSelect": "multi",
"aButtons": [
{ "sExtends": "editor_create", "editor": editor },
{ "sExtends": "editor_edit", "editor": editor },
{ "sExtends": "editor_remove", "editor": editor }
]
},
"aoColumns": [
{ "sTitle": "id" },
{ "sTitle": "Name" },
{ "sTitle": "Surname" },
{ "sTitle": "Email" },
{
"sTitle": "Admin",
"sClass": "center",
"sDefaultContent": '<a href="" class="editor_edit">Edit</a>/<a href="" class="editor_remove">Delete</a>'
}
],
});
oTable.fnSetColumnVis(7, false);
oTable.fnSetColumnVis(8, false);
oTable.fnSetColumnVis(9, false);
// New record
$('a.editor_create').on('click', function (e) {
e.preventDefault();
editor.create(
'Create new record',
{ "label": "Add", "fn": function() { editor.submit() } }
);
});
// Edit record
$('#example').on('click', 'a.editor_edit', function (e) {
e.preventDefault();
editor.edit(
$(this).parents('tr')[0],
'Edit record',
{ "label": "Update", "fn": function() { editor.submit() } }
);
});
// Delete a record (without asking a user for confirmation)
$('#example').on('click', 'a.editor_remove', function (e) {
e.preventDefault();
editor.remove($(this).parents('tr')[0], '123', false, false);
editor.submit();
});
var asInitVals = new Array();
$("#filter input").keyup(function() {
/* Filter on the column (the index) of this element */
oTable.fnFilter(this.value, $("#filter input").index(this)+1);
//console.log($("#filter input").index(this)+1);
});
/*
* Support functions to provide a little bit of 'user friendlyness' to the textboxes in
* the footer
*/
$("#filter input").each(function (i) {
asInitVals[i] = this.value;
});
$("#filter input").focus(function() {
if (this.className == "search_init")
{
this.className = "";
this.value = "";
}
});
$("#filter input").blur(function (i) {
if (this.value == "")
{
this.className = "search_init";
this.value = asInitVals[$("#filter input").index(this)];
}
});
});
}(jQuery));
</script>
당신은 너무 친절하고 초기 Initializatio 전체를 추가 할 수 있습니까? 질문에 n 코드? 또한이 함수'$ .fn.dataTable.Editor()'를 질문에 추가하여 가능한 모든 오류를 검사 할 수 있습니까? – Drakkainen
편집 됨 .. thsanks @Iro. – Cybercampbell