add a Loading indicator to show fetching data in progress
This commit is contained in:
parent
847dbb23b5
commit
29962bb4b2
|
|
@ -507,6 +507,8 @@ if (count($_POST) > 0) {
|
||||||
//draggable rows are initially empty
|
//draggable rows are initially empty
|
||||||
echo "<tbody id='structure'>\n";
|
echo "<tbody id='structure'>\n";
|
||||||
echo "</tbody>";
|
echo "</tbody>";
|
||||||
|
//show loading
|
||||||
|
echo "<tbody id='loading'><tr><td> </td><td><center>Loading...</center></td><td> </td></tr></tbody>\n";
|
||||||
//cloning row and buttons created outside of 'structure' table body
|
//cloning row and buttons created outside of 'structure' table body
|
||||||
echo "<tbody>";
|
echo "<tbody>";
|
||||||
echo "<tr id='empty_row' style='display: none;'>\n";
|
echo "<tr id='empty_row' style='display: none;'>\n";
|
||||||
|
|
|
||||||
|
|
@ -41,6 +41,14 @@ document.addEventListener("DOMContentLoaded", async function () {
|
||||||
add_draggable_rows();
|
add_draggable_rows();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
function remove_loading() {
|
||||||
|
//remove loading
|
||||||
|
const loading = document.getElementById('loading');
|
||||||
|
if (loading) {
|
||||||
|
loading.remove();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
async function fetch_data(command) {
|
async function fetch_data(command) {
|
||||||
try {
|
try {
|
||||||
const response = await fetch('phrase_responder.php', {
|
const response = await fetch('phrase_responder.php', {
|
||||||
|
|
@ -104,6 +112,8 @@ async function add_existing() {
|
||||||
select_action.dispatchEvent(changeEvent);
|
select_action.dispatchEvent(changeEvent);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
remove_loading();
|
||||||
}
|
}
|
||||||
|
|
||||||
//
|
//
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue