3
죄송합니다. @MDeSchaepmeester & @charlietfl이 작동해야한다고 지적 했으므로 지금은 알 수 있습니다. 이제 문제는 DataTable을 렌더링하지 않는 것입니다.Javascript 배열에서 함수에 전달할 때 내용이 손실됩니다.
DataTables에 오류없이로드되지 않는 이유에 대한 제안은 환영합니다!
function PartnerListSupportTickets() {
jQuery("#loader").show();
var idOpen = 'tickets-tbl-open';
var idOnHold = 'tickets-tbl-on-hold';
var idDeferred = 'tickets-tbl-deferred';
var idClosed = 'tickets-tbl-closed';
var tblDataOpen = [];
var tblDataOnHold = [];
var tblDataDeferred = [];
var tblDataClosed = [];
var tblEmptyMsg = [];
tblEmptyMsg.push({
ticket: 'No tickets available for this category',
postcode: '-',
state: '-',
customer: '-',
status: '-',
priority: '-',
fault: '-',
category: '-',
author: '-',
owner: '-',
age: '-',
lastupdate: '-'
});
var get_data_url = '/sma-php/gettickets.php?var=PARTCK&pid=' + sessionStorage.party_id;
jQuery.getJSON(get_data_url, function(data) {
OpenNum = 0;
OnHoldNum = 0;
DeferredNum = 0;
ClosedNum = 0;
jQuery.each(data, function(i, d) {
var status = d.status;
status = status.toLowerCase();
if(status == 'closed') {
var now = moment();
var then = moment(d.create_date);
d.days_age = now.diff(then, 'days');
};
switch(status) {
case('open'):
OpenNum = OpenNum + 1;
tblDataOpen.push({
ticket: '<span id="' + d.ticket_id + '" class="ticket-id-class">' + d.short_title + '</span>',
postcode: d.postcode,
state: d.state,
customer: d.customer_name,
status: d.status,
priority: '<font color="' + d.color + '">' + d.priority + '</font>',
fault: d.fault_type,
category: d.category,
author: d.author_name,
owner: d.owner_name,
age: d.days_age,
lastupdate: d.update_date
});
break;
case('on hold'):
OnHoldNum = OnHoldNum + 1;
tblDataOnHold.push({
ticket: '<span id="' + d.ticket_id + '" class="ticket-id-class">' + d.short_title + '</span>',
postcode: d.postcode,
state: d.state,
customer: d.customer_name,
status: d.status,
priority: '<font color="' + d.color + '">' + d.priority + '</font>',
fault: d.fault_type,
category: d.category,
author: d.author_name,
owner: d.owner_name,
age: d.days_age,
lastupdate: d.update_date
});
break;
case('deferred'):
DeferredNum = DeferredNum + 1;
tblDataDeferred.push({
ticket: '<span id="' + d.ticket_id + '" class="ticket-id-class">' + d.short_title + '</span>',
postcode: d.postcode,
state: d.state,
customer: d.customer_name,
status: d.status,
priority: '<font color="' + d.color + '">' + d.priority + '</font>',
fault: d.fault_type,
category: d.category,
author: d.author_name,
owner: d.owner_name,
age: d.days_age,
lastupdate: d.update_date
});
break;
case('closed'):
ClosedNum = ClosedNum + 1;
tblDataClosed.push({
ticket: '<span id="' + d.ticket_id + '" class="ticket-id-class">' + d.short_title + '</span>',
postcode: d.postcode,
state: d.state,
customer: d.customer_name,
status: d.status,
priority: '<font color="' + d.color + '">' + d.priority + '</font>',
fault: d.fault_type,
category: d.category,
author: d.author_name,
owner: d.owner_name,
age: d.days_age,
lastupdate: d.update_date
});
break;
default:
};
});
if(OpenNum > 0) {
renderPartnerTicketsList(tblDataOpen, idOpen, true);
} else {
renderPartnerTicketsList(tblEmptyMsg, idOpen, true);
};
if(OnHoldNum > 0) {
renderPartnerTicketsList(tblDataOnHold, idOnHold, true);
} else {
renderPartnerTicketsList(tblEmptyMsg, idOnHold, true);
};
if(DeferredNum > 0) {
renderPartnerTicketsList(tblDataDeferred, idDeferred, true);
} else {
renderPartnerTicketsList(tblEmptyMsg, idDeferred, true);
};
if(ClosedNum > 0) {
renderPartnerTicketsList(tblDataClosed, idClosed, true);
} else {
renderPartnerTicketsList(tblEmptyMsg, idClosed, true);
};
jQuery('a[href="#tab1c47048a"]').html('Open Tickets<span class="ticket-count">' + OpenNum + '</span>');
jQuery('a[href="#tab281c055c"]').html('On Hold Tickets<span class="ticket-count">' + OnHoldNum + '</span>');
jQuery('a[href="#tab328b0619"]').html('Deferred Tickets<span class="ticket-count">' + DeferredNum + '</span>');
jQuery('a[href="#tab26b60552"]').html('Closed Tickets<span class="ticket-count">' + ClosedNum + '</span>');
})
.done(function() {
jQuery("#loader").fadeOut("slow");
})
.fail(function(jqxhr, textStatus, error) {
var sysError = textStatus + ", " + error;
showPopupMsg(errorClass, logoutFlag, "There was an error retrieving your Support Tickets List.<br/>Page wll not load from this point and you will be returned to our home page...<br/>Error: " + sysError);
});
};
function renderPartnerTicketsList(tblData, id, initLoad) {
// Set up data for DataTable plugin
if (!initLoad) {
var tbl = jQuery('#' + id).DataTable();
tbl.clear();
tbl.rows.add(tblData);
tbl.draw();
return;
};
// Bind DataTable plugin
var tblHtml = '<table cellpadding="0" cellspacing="0" border="0" class="display" id="' + id + '"><thead><tr>';
tblHtml += '<th>Ticket</th>';
tblHtml += '<th>Postcode</th>';
tblHtml += '<th>State</th>';
tblHtml += '<th>Customer</th>';
tblHtml += '<th>Status</th>';
tblHtml += '<th>Priority</th>';
tblHtml += '<th>Fault</th>';
tblHtml += '<th>Category</th>';
tblHtml += '<th>Author</th>';
tblHtml += '<th>Owner</th>';
tblHtml += '<th>Age</th>';
tblHtml += '<th>Last Update</th>';
tblHtml += '</tr></thead><tbody></tbody></table>';
jQuery('#' + id + '-container').html(tblHtml);
jQuery('#' + id).dataTable({
data: tblData,
columns: [
{ data: "ticket" },
{ data: "postcode" },
{ data: "state" },
{ data: "customer" },
{ data: "status" },
{ data: "priority" },
{ data: "fault" },
{ data: "category" },
{ data: "author" },
{ data: "owner" },
{ data: "age" },
{ data: "lastupdate" }
],
pageLength: 25,
order: [12, 'desc'],
"scrollCollapse": false,
"jQueryUI": true,
responsive: true
});
};
은 내가 함수에 전달 아래에 한 번 코드에서 배열의 내부 값을 잃는 오전 :
여기의 요청에 따라 모든 코드입니다. 내 페이지에서 jQuery DataTables를 사용하고 있습니다. 구문 오류가 있지만 빈 배열로 인해 코드가 실패합니다.
주요 CODE :
jQuery.each(data, function(i, d) {
tblDataOpen.push({
ticket: '<span id="' + d.ticket_id + '" class="ticket-id-class">' + d.short_title + '</span>',
postcode: d.postcode,
state: d.state,
customer: d.customer_name
});
console.log(tblDataOpen); // <=== SHOWS THE ARRAY AS EXPECTED
renderPartnerTicketsList(tblDataOpen, 'open');
기능 :이 같은
function renderPartnerTicketsList(tblData, id) {
console.log(tblData); // <=== SHOWS AN EMPTY OBJECT
var tblHtml = '<table cellpadding="0" cellspacing="0" border="0" class="display" id="' + id + '"><thead><tr>';
tblHtml += '<th>Ticket</th>';
tblHtml += '<th>Postcode</th>';
tblHtml += '<th>State</th>';
tblHtml += '<th>Customer</th>';
tblHtml += '</tr></thead><tbody></tbody></table>';
jQuery('#' + id + '-container').html(tblHtml);
console.log(tblData);
jQuery('#' + id).dataTable({
data: tblData,
columns: [
{ data: "ticket" },
{ data: "postcode" },
{ data: "state" },
{ data: "customer" }
],
pageLength: 25,
order: [3, 'desc'],
"scrollCollapse": false,
"jQueryUI": true,
responsive: true
});
};
tblData에 값을 전달하고 tblDataOpen 대신 tblData를 사용합니다. –
죄송합니다. Alex G. 위 코드를 수정했습니다. 함수에서 tblData를 사용하고 있습니다. – TheRealPapa
'$ .extend (true, [], tblDataOpen);'renderPartnerTicketsList'에 복제 된 사본을 전달하십시오. – vsync