add and delete buttons for tables
This commit is contained in:
parent
02390e3a1f
commit
31dec273d6
@ -3,7 +3,7 @@ var contentTable;
|
||||
|
||||
async function initContentTable() {
|
||||
contentOptions = await getTrackedContentOptions();
|
||||
await initTable("#contentTabPane", "contentTable", loadContent, contentOptions);
|
||||
await initTable("#contentTabPane", "contentTable", loadContent, null, deleteSelectedContent, contentOptions);
|
||||
|
||||
contentTable = $("#contentTable").DataTable({
|
||||
info: false,
|
||||
@ -100,7 +100,7 @@ async function initContentTable() {
|
||||
]
|
||||
});
|
||||
|
||||
bindTableCheckboxes("#contentTable", contentTable, "#deleteSelectedContentBtn");
|
||||
bindTableCheckboxes("#contentTable", contentTable, "#contentTabPane .table-del-btn");
|
||||
}
|
||||
|
||||
function handleDiscordChannelNames() {
|
||||
@ -147,7 +147,7 @@ async function goToSubscription(subId) {
|
||||
await showEditSubModal(subId);
|
||||
}
|
||||
|
||||
$("#deleteSelectedContentBtn").on("click", async function() {
|
||||
async function deleteSelectedContent() {
|
||||
|
||||
var rows = contentTable.rows(".selected").data();
|
||||
$.each(rows, async function() {
|
||||
@ -158,7 +158,7 @@ $("#deleteSelectedContentBtn").on("click", async function() {
|
||||
setTimeout(async () => {
|
||||
await loadContent(getCurrentlyActiveServer().guild_id);
|
||||
}, 600)
|
||||
});
|
||||
}
|
||||
|
||||
function clearExistingContentRows() {
|
||||
$("#contentTable thead .table-select-all").prop("checked", false).prop("indeterminate", false);
|
||||
@ -180,7 +180,7 @@ async function loadContent(guildId, page=1, pageSize=null, search=null) {
|
||||
if (!search)
|
||||
search = $("#contentTabPane .table-searchbar").val();
|
||||
|
||||
$("#deleteSelectedContentBtn").prop("disabled", true);
|
||||
$("#contentTabPane .table-del-btn").prop("disabled", true);
|
||||
clearExistingContentRows();
|
||||
|
||||
try {
|
||||
|
||||
@ -4,7 +4,7 @@ var filtersTable;
|
||||
// Create filters table
|
||||
async function initFiltersTable() {
|
||||
filterOptions = await getFilterOptions();
|
||||
await initTable("#filtersTabPane", "filtersTable", loadFilters, filterOptions);
|
||||
await initTable("#filtersTabPane", "filtersTable", loadFilters, showEditFilterModal, deleteSelectedFilters, filterOptions);
|
||||
|
||||
filtersTable = $("#filtersTable").DataTable({
|
||||
info: false,
|
||||
@ -79,7 +79,7 @@ async function initFiltersTable() {
|
||||
]
|
||||
});
|
||||
|
||||
bindTableCheckboxes("#filtersTable", filtersTable, "#deleteSelectedFiltersBtn");
|
||||
bindTableCheckboxes("#filtersTable", filtersTable, "#filtersTabPane .table-del-btn");
|
||||
}
|
||||
|
||||
$("#addFilterBtn").on("click", async function() {
|
||||
@ -183,7 +183,7 @@ async function loadFilters(guildId, page=1, pageSize=null, search=null) {
|
||||
if (!search)
|
||||
search = $("#filtersTabPane .table-searchbar").val();
|
||||
|
||||
$("#deleteSelectedFiltersBtn").prop("disabled", true);
|
||||
$("#filtersTabPane .table-del-btn").prop("disabled", true);
|
||||
clearExistingFilterRows();
|
||||
|
||||
try {
|
||||
@ -242,8 +242,7 @@ $(document).on("selectedServerChange", async function() {
|
||||
await loadFilters(activeServer.guild_id);
|
||||
});
|
||||
|
||||
$("#deleteSelectedFiltersBtn").on("click", async function() {
|
||||
|
||||
async function deleteSelectedFilters() {
|
||||
var rows = filtersTable.rows(".selected").data();
|
||||
$.each(rows, async function() {
|
||||
await deleteFilter(this.id);
|
||||
@ -255,7 +254,7 @@ $("#deleteSelectedFiltersBtn").on("click", async function() {
|
||||
await loadFilters(guildId);
|
||||
loadFilterOptions(guildId);
|
||||
}, 500)
|
||||
})
|
||||
}
|
||||
|
||||
$("#deleteEditFilter").on("click", async function() {
|
||||
const filterId = $("#filterId").val();
|
||||
|
||||
@ -6,7 +6,7 @@ var subTable = null;
|
||||
// Create subscription table
|
||||
async function initSubscriptionTable() {
|
||||
subOptions = await getSubscriptionOptions();
|
||||
await initTable("#subscriptionsTabPane", "subTable", loadSubscriptions, subOptions);
|
||||
await initTable("#subscriptionsTabPane", "subTable", loadSubscriptions, showEditSubModal, deleteSelectedSubscriptions, subOptions);
|
||||
|
||||
subTable = $("#subTable").DataTable({
|
||||
info: false,
|
||||
@ -121,7 +121,7 @@ async function initSubscriptionTable() {
|
||||
]
|
||||
});
|
||||
|
||||
bindTableCheckboxes("#subTable", subTable, "#deleteSelectedSubscriptionsBtn");
|
||||
bindTableCheckboxes("#subTable", subTable, "#subscriptionsTabPane .table-del-btn");
|
||||
}
|
||||
|
||||
$("#subscriptionsTabPane").on("change", ".sub-toggle-active", async function () {
|
||||
@ -352,7 +352,7 @@ async function loadSubscriptions(guildId, page=1, pageSize=null, search=null) {
|
||||
if (!search)
|
||||
search = $("#subscriptionsTabPane .table-searchbar").val();
|
||||
|
||||
$("#deleteSelectedSubscriptionsBtn").prop("disabled", true);
|
||||
$("#subscriptionsTabPane .table-del-btn").prop("disabled", true);
|
||||
clearExistingSubRows();
|
||||
|
||||
try {
|
||||
@ -446,18 +446,14 @@ $("#deleteEditSub").on("click", async function() {
|
||||
showToast("danger", "Deleted Subscription", "Subscription ID: " + subId);
|
||||
});
|
||||
|
||||
$("#deleteSelectedSubscriptionsBtn").on("click", async function() {
|
||||
// showToast("danger", "Not Implemented", "This feature isn't implemented");
|
||||
|
||||
async function deleteSelectedSubscriptions() {
|
||||
var rows = subTable.rows(".selected").data();
|
||||
$.each(rows, async function() {
|
||||
// alert(JSON.stringify(this, null, 4));
|
||||
await deleteSubscription(this.id);
|
||||
showToast("danger", "Deleted Subscription", "Subscription ID: " + this.id);
|
||||
});
|
||||
|
||||
await loadSubscriptions(getCurrentlyActiveServer().guild_id);
|
||||
})
|
||||
}
|
||||
|
||||
// #endregion
|
||||
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
var timeouts = {};
|
||||
|
||||
async function initTable(containingSelector, tableId, loadDataFunc, options=null) {
|
||||
async function initTable(containingSelector, tableId, loadDataFunc, newRowFunc, deleteSelectedFunc, options=null) {
|
||||
let pageSizeId = tableId + "PageSize";
|
||||
searchId = tableId + "SearchBar";
|
||||
sortDropdownId = tableId + "SortDropdown";
|
||||
filterDropdownId = tableId + "FilterDropdown";
|
||||
|
||||
createSearchRow(containingSelector, searchId, sortDropdownId, filterDropdownId, options);
|
||||
createSearchRow(containingSelector, searchId, sortDropdownId, filterDropdownId, options, newRowFunc, deleteSelectedFunc);
|
||||
createTable(containingSelector, tableId);
|
||||
createTableControls(containingSelector, pageSizeId);
|
||||
|
||||
@ -15,7 +15,7 @@ async function initTable(containingSelector, tableId, loadDataFunc, options=null
|
||||
await bindTablePaginationResizer(`${containingSelector} .table-page-sizer`, loadDataFunc);
|
||||
}
|
||||
|
||||
function createSearchRow(containingSelector, searchId, sortDropdownId, filterDropdownId, options) {
|
||||
function createSearchRow(containingSelector, searchId, sortDropdownId, filterDropdownId, options, newRowFunc, deleteSelectedFunc) {
|
||||
$(containingSelector).append(`
|
||||
<div class="row my-3 px-3 table-search-row">
|
||||
<div class="col-lg-4">
|
||||
@ -26,17 +26,26 @@ function createSearchRow(containingSelector, searchId, sortDropdownId, filterDro
|
||||
<input type="search" id="${searchId}" name="${searchId}" class="form-control table-searchbar" placeholder="Search">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-8 text-end table-search-buttons"></div>
|
||||
<div class="col-lg-8 text-end table-search-buttons">
|
||||
<div class="d-inline-block ms-3">
|
||||
<button type="button" class="table-refresh-btn btn btn-outline-secondary rounded-1">
|
||||
<i class="bi bi-arrow-clockwise"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`);
|
||||
|
||||
$(`${containingSelector} .table-search-row .table-search-buttons`).append(`
|
||||
<div class="d-inline-block ms-3">
|
||||
<button type="button" class="table-refresh-btn btn btn-outline-secondary rounded-1">
|
||||
<i class="bi bi-arrow-clockwise"></i>
|
||||
</button>
|
||||
</div>
|
||||
`);
|
||||
if (newRowFunc) {
|
||||
$(`${containingSelector} .table-search-row .table-search-buttons`).prepend(`
|
||||
<div class="d-inline-block ms-3">
|
||||
<button type="button" class="table-new-btn btn btn-primary rounded-1">
|
||||
<i class="bi bi-plus-lg"></i>
|
||||
</button>
|
||||
</div>
|
||||
`)
|
||||
$(`${containingSelector} .table-search-row .table-search-buttons .table-new-btn`).on("click", async () => {await newRowFunc(-1)});
|
||||
}
|
||||
|
||||
if (options.sort) {
|
||||
$(`${containingSelector} .table-search-row .table-search-buttons`).append(`
|
||||
@ -69,6 +78,17 @@ function createSearchRow(containingSelector, searchId, sortDropdownId, filterDro
|
||||
`);
|
||||
populateFilterDropdown();
|
||||
}
|
||||
|
||||
if (deleteSelectedFunc) {
|
||||
$(`${containingSelector} .table-search-row .table-search-buttons`).append(`
|
||||
<div class="d-inline-block ms-3">
|
||||
<button type="button" class="table-del-btn btn btn-danger rounded-1">
|
||||
<i class="bi bi-trash3"></i>
|
||||
</button>
|
||||
</div>
|
||||
`)
|
||||
$(`${containingSelector} .table-search-row .table-search-buttons .table-del-btn`).on("click", async () => {await deleteSelectedFunc()});
|
||||
}
|
||||
}
|
||||
|
||||
function populateSortDropdown(sortDropdownId, sortOptions) {
|
||||
|
||||
@ -71,25 +71,10 @@
|
||||
</ul>
|
||||
<div class="tab-pane-buttons">
|
||||
<div class="tab-pane-buttons-item" data-tab="subscriptionsTab">
|
||||
<button type="button" id="addSubscriptionBtn" class="btn btn-primary rounded-1 me-3">
|
||||
<i class="bi bi-plus-lg"></i>
|
||||
</button>
|
||||
<button type="button" id="deleteSelectedSubscriptionsBtn" class="btn btn-danger rounded-1 ms-0" disabled>
|
||||
<i class="bi bi-trash3"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="tab-pane-buttons-item" data-tab="filtersTab">
|
||||
<button type="button" id="addFilterBtn" class="btn btn-primary rounded-1 me-3">
|
||||
<i class="bi bi-plus-lg"></i>
|
||||
</button>
|
||||
<button type="button" id="deleteSelectedFiltersBtn" class="btn btn-danger rounded-1 ms-0">
|
||||
<i class="bi bi-trash3"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="tab-pane-buttons-item" data-tab="contentTab">
|
||||
<button type="button" id="deleteSelectedContentBtn" class="btn btn-danger rounded-1 ms-0">
|
||||
<i class="bi bi-trash3"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user