Is there a way to create an HTML markup with a GIF progress bar that appears when the page is loading? I want to use Ajax to fetch data, populate the markup, and then hide the GIF. How can I achieve this functionality using KnockoutJS?
var Item = function () {
var self = this;
self.name = ko.observable();
};
var ItemList = function () {
var self = this;
self.list = ko.observableArray();
var blocks = await get_blocks();
$.each(blocks, function (index, value) {
self.list.push(new Item());
});
//first, show the HTML-blocks, and then fill them
$.each(self.list(), async function (index, value) {
var data = await getData("some-url");
self.list()[index].name = data.name;
});
};
ko.applyBindings(new ItemList());