 |
datalist: set loading class and add (optional) loading gif (CSS) - jscancer - J… |
 |
git clone git://git.codemadness.org/jscancer |
 |
Log |
|
Files |
|
Refs |
|
README |
|
LICENSE |
|
--- |
|
commit aa6690aad0a7b64010561df965d589b8f1a59a75 |
|
parent e0c81bf5b28e8e3ae06401063522752d7c4de854 |
|
Author: Hiltjo Posthuma <[email protected]> |
|
Date: Mon, 25 Mar 2024 20:47:31 +0100 |
|
|
|
datalist: set loading class and add (optional) loading gif (CSS) |
|
|
|
Diffstat: |
|
M datalist/datalist.js | 7 +++++++ |
|
A datalist/loading.css | 8 ++++++++ |
|
|
|
2 files changed, 15 insertions(+), 0 deletions(-) |
|
--- |
|
diff --git a/datalist/datalist.js b/datalist/datalist.js |
|
@@ -72,8 +72,15 @@ function datalist_init(input) { |
|
} |
|
|
|
timer = setTimeout(function() { |
|
+ // set class for loading indicator styling. |
|
+ input.classList.add("loading"); |
|
+ |
|
var x = new(XMLHttpRequest); |
|
x.onreadystatechange = function() { |
|
+ // remove loading indicator when "DONE… |
|
+ if (x.readyState == 4) |
|
+ input.classList.remove("loadin… |
|
+ |
|
if (x.readyState != 4 || [ 0, 200 ].in… |
|
return; |
|
|
|
diff --git a/datalist/loading.css b/datalist/loading.css |
|
@@ -0,0 +1,7 @@ |
|
+/* loader gif animation */ |
|
+input.datalist.loading { |
|
+ cursor: wait; |
|
+ background-image: url("data:image/gif;base64,R0lGODlhEAAQAIQAAP////f39… |
|
+ background-repeat: no-repeat; |
|
+ background-position: center right; |
|
+} |
|
+\ No newline at end of file |
