corbz/PYRSS-Website
corbz/PYRSS-Website
1
0
Fork 0
Code Issues 21 Pull Requests Actions Releases 1 Wiki Activity

working on sub datatable

Browse Source
This commit is contained in:
Corban-Lee Jones 2024-04-23 20:59:11 +01:00
parent 30780e81b3
commit 1c79433535
2 changed files with 121 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

148
apps/static/js/home/subscriptions.js
View File

@ -1,32 +1,5 @@
var subTable = null;
// Select a row via checkbox
$("#subTable tbody").on("change", ".form-check-input", function() {
$('#subTable tbody tr:not(.selected) th input[type="checkbox"]').prop("checked", false);
$('#subTable tbody tr.selected th input[type="checkbox"]').prop("checked", true);
subTable.rows(".selected").select();
subTable.rows(":not(.selected)").deselect();
});
// Select all rows checkbox
$('#subTable thead th:first-child input[type="checkbox"]').on("change", function() {
var selected = $(this).prop("checked");
$('#subTable tbody tr').each(function(rowIndex) {
var row = subTable.row(rowIndex)
if (selected) row.select();
else row.deselect();
$(this).find('th input[type="checkbox"]').prop("checked", selected);
});
});
// Alert the number of selected rows
$("#tableButton").on("click", function() {
var selectedRows = subTable.rows({ selected: true }).data(false).toArray();
alert(selectedRows.length + " row(s) are selected");
});
// Create subscription table
function initSubscriptionTable() {
subTable = $("#subTable").DataTable({
@ -34,17 +7,126 @@ function initSubscriptionTable() {
paging: false,
searching: false,
autoWidth: false,
order: [],
select: {
style: "multi+shift",
selector: 'th:first-child input[type="checkbox"]'
},
order: [],
columnDefs: [
{ orderable: false, targets: "no-sort" },
{
targets: 0,
checkboxes: { selectRow: true }
}
// {
// targets: 0,
// checkboxes: { selectRow: true }
// }
],
columns: [
{
title: "",
data: null,
orderable: false,
className: "text-center",
render: function() {
return '<input type="checkbox" class="form-check-input" />'
}
},
{ title: "Name", data: "name" },
{ title: "URL", data: "url" },
{ title: "Channels", data: "channels_count" },
{ title: "Created", data: "created" },
{
title: "Notes",
data: "notes",
orderable: false,
className: "text-center",
render: function(data, type) {
return `<i class="bi bi-chat-left-text" title="${data}"></i>`
}
},
{
title: "Active",
data: "active",
orderable: false,
className: "text-center",
render: function(data, type) {
var check = $('<input type="checkbox" class="form-check-input" />');
check.prop("checked", data);
return check[0]
}
},
],
createdRow: function(row, data, dataIndex) {
// Insert checkbox in the first cell of each row
$(row).find('td:eq(0)').html('<input type="checkbox" class="form-check-input" />');
}
});
}
subTable.rows.add([
{
name: "BBC News",
url: "https://feeds.bbci.co.uk/news/rss.xml",
channels_count: 3,
created: "13-03-2024",
notes: "No Description",
active: true
},
{
name: "BBC News - Entertainment",
url: "https://feeds.bbci.co.uk/news/entertainment_and_arts/rss.xml",
channels_count: 1,
created: "22-03-2024",
notes: "No Description",
active: true
},
{
name: "BBC News - Politics",
url: "https://feeds.bbci.co.uk/news/politics/rss.xml",
channels_count: 5,
created: "16-03-2024",
notes: "No Description",
active: true
},
{
name: "BBC News - North America",
url: "https://feeds.bbci.co.uk/news/north_america/rss.xml",
channels_count: 2,
created: "04-04-2024",
notes: "No Description",
active: true
}
]).draw(false);
}
// Select a row via checkbox
$("#subTable tbody").on("change", "tr td:first-child .form-check-input", function() {
var selected = $(this).prop("checked");
rowIndex = $(this).closest("tr").index();
row = subTable.row(rowIndex);
if (selected) row.select();
else row.deselect();
// $('#subTable tbody tr:not(.selected) td input[type="checkbox"]').prop("checked", false);
// $('#subTable tbody tr.selected td input[type="checkbox"]').prop("checked", true);
// subTable.rows(".selected").select();
// subTable.rows(":not(.selected)").deselect();
});
// Select all rows checkbox
$('#subTable thead td:first-child input[type="checkbox"]').on("change", function() {
var selected = $(this).prop("checked");
$('#subTable tbody tr').each(function(rowIndex) {
var row = subTable.row(rowIndex)
if (selected) row.select();
else row.deselect();
$(this).find('td input[type="checkbox"]').prop("checked", selected);
});
});
// Alert the number of selected rows
$("#tableButton").on("click", function() {
var selectedRows = subTable.rows({ selected: true }).data(false).toArray();
alert(selectedRows.length + " row(s) are selected");
});

13
apps/templates/home/index.html
View File

@ -44,10 +44,10 @@
<table id="subTable" class="table table-hover">
<thead>
<tr>
<th scope="col" class="text-center no-sort">
{% comment %} <th scope="col" class="text-center no-sort">
<input type="checkbox" class="form-check-input" />
</th>
<th scope="col">Name</th>
</th> {% endcomment %}
{% comment %} <th scope="col">Name</th>
<th scope="col">RSS URL</th>
<th scope="col">Channels</th>
<th scope="col">Created</th>
@ -57,11 +57,11 @@
<a href="#" class="text-body">
<i class="bi bi-plus-lg"></i>
</a>
</th>
</th> {% endcomment %}
</tr>
</thead>
<tbody>
<tr>
{% comment %} <tr>
<th scope="row" class="text-center">
<input type="checkbox" class="form-check-input" />
</th>
@ -88,7 +88,7 @@
<i class="bi bi-pencil"></i>
</a>
</td>
</tr>
</tr> {% endcomment %}
</tbody>
</table>
</div>
@ -109,7 +109,6 @@
</li>
</script>
<script src="{% static 'js/api.js' %}"></script>
{% comment %} <script src="{% static 'js/home.js' %}"></script> {% endcomment %}
<script src="{% static 'js/home/index.js' %}"></script>
<script src="{% static 'js/home/servers.js' %}"></script>
<script src="{% static 'js/home/subscriptions.js' %}"></script>