implement spinner to show loading status

This commit is contained in:
2021-06-03 21:06:30 +02:00
parent 3a028607b4
commit 8f8eba81fa
2 changed files with 8 additions and 1 deletions

View File

@@ -90,6 +90,8 @@ function fastPosChanged() {
function balance(){ function balance(){
cont = document.getElementById("response-container")
cont.innerHTML = ""
sides = ["left", "right"] sides = ["left", "right"]
blue = [ "", "", "", "", ""] blue = [ "", "", "", "", ""]
@@ -129,6 +131,8 @@ function balance(){
jsonData = JSON.stringify(dictAll, null, 4); jsonData = JSON.stringify(dictAll, null, 4);
/* transmitt */ /* transmitt */
spinner = document.getElementById("loading")
spinner.style.display = "block";
fetch(window.location.href, { fetch(window.location.href, {
method: 'post', method: 'post',
headers: { headers: {
@@ -136,7 +140,7 @@ function balance(){
'Content-Type': 'application/json' }, 'Content-Type': 'application/json' },
body: jsonData body: jsonData
}).then(r => r.json()).then(j => { }).then(r => r.json()).then(j => {
cont = document.getElementById("response-container") spinner.style.display = "none";
cont.innerHTML = j["content"] cont.innerHTML = j["content"]
}) })

View File

@@ -18,6 +18,9 @@
<button type="button" class="mb-3 btn btn-secondary" onclick="balance()">Go</button> <button type="button" class="mb-3 btn btn-secondary" onclick="balance()">Go</button>
<div class="spinner-border" id="loading" style="display: none;" role="status">
<span class="sr-only">Loading...</span>
</div>
<div id="response-container" class="mt-3 mb-3"> <div id="response-container" class="mt-3 mb-3">
</div> </div>