Temporarily Display A Hardcoded Value In Column Until Correct Data Passed From Backend Code
Temporarily Display A Hardcoded Value In Column Until Correct Data Passed From Backend Code
murday1983
Posts: 32Questions: 12Answers: 0
I am new to datatables
and was wondering how I display a hardcoded value in my datatable
column until my backend passes me the correct value
** JQuery**
This is what I have tried
{ data: null,
render: function () {
return `<span>TO POPULATE<span>`;
}
},
This is part of the column
code I have:
columns: [
{ data: 'id', name: 'id', render: function (data) {
return data;
}
},
{ data: 'name', name: 'name', className: "text-capitalize" },
{
data: 'customer_price',
name: 'customerPrice',
render: $.fn.dataTable.render.number( '.', '.', 2, '£')
},
{ data: 'total_seconds', name: 'totalMinutes', render: function (data) { return data / 60} },
{ data: null,
render: function () {
return `<span>Boo<span>`;
}
},
{ data: 'createdBy', name: 'created_by', visible: isAdmin },
{ data: 'created', name: 'start_date', className: "text-center" },
{ data: 'deactivated_on', name: 'end_date', className: "text-center", visible: showEndDate},
{ data: 'deactivatedBy', name: 'deactivated_by', visible: isAdmin && showEndDate },
{
data: null,
searchable: false,
sortable: false,
className: 'text-center',
visible: !showEndDate,
render: function (data) {
let checked = (data.status === '1') ? 'checked' : '';
return '<label class="switch">' +
'<input data-id="' + data.id + '" data-status="' + data.status + '" name="service_slider" type="checkbox"' + checked +' class="js-status-col">' +
'<span class="slider round" title="Click to deactivate this call plan."></span>' +
'</label>'
}
},
HTML
<table id="manage-tab-datatable" class="table">
<thead>
<tr>
<th>ID</th>
<th style="width: 400px">Name</th>
<th style="width: 100px">Price</th>
<th style="width: 75px">Minutes</th>
<th style="width: 75px">Discount</th>
<th>Created by</th>
<th class="text-center" style="width: 100px">Start date</th>
<th class="text-center" style="width: 100px">End date</th>
<th>Deactivated by</th>
<th>Visible to customers</th>
<th>Customer count</th>
<th class="text-center" style="width: 175px">Actions</th>
</tr>
</thead>
<tbody></tbody>
</table>
The table displays fine as soon as I remove what I thought would work, and it also displays the slider fine as shown above, so I have no idea why it's not working, and there are no console errors either to help me
Replies
is the way to do it. Then either add the row id to a queue that should be processed, or on each
draw
scan the table to see if there are any cells to be processed and add that to the queue.The queue would then run, either as a batch, or individually, getting the data and calling
row().data()
(or perhapscell().data()
) to update the data as returned by the server. Assuming you are using the table in client-side processing mode, that would then allow it to be searched / sorted / etc.If that isn't working, I'd need a link to a test case showing the issue to be able to try and help diagnose the issue.
You do hard to be careful doing this - make sure your queue isn't going to DDOS your own server with loads of requests every time someone loads your page.
Allan
Link to demo
https://live.datatables.net/befujodu/3/edit
Fixed. I had the following lines of code
The commmented out one was my original line beofre the new column was to be added but instead of
I put '5' instead of $
But as i say there was not console error or error on screen
'^$'
means an empty string in regex.^5
means starts with 5.Good to hear you've got it working as you need now.
Allan