Hi Carsten,
Thank you for your update.
In the sample provided previously, we have also added a tab with first tab item loaded by default and another tab item using URL. In order to display waiting popup control we need have used ClientSideOnActive event on tab to fetch the data of the URL instead of giving the URL directly in the URL property of tab item. Kindly refer to the following code snippet.
|
<script>
var dataLoaded = false, popupObj;
function active() {
if (!dataLoaded) { // To check the ajax data is already loaded or not
$.ajax({
type: "GET",
url: "http://localhost:57773/Content/samplecontent/mvccontent.html",
dataType: "html",
beforeSend: function () {
if (!popupObj) {
$("#MVC").ejWaitingPopup({
showOnInit: true
}); // Creating the WaitingPopup to the tab content div before Ajax Send.
}
else {
popupObj.refresh();
popupObj.show();
}
},
success: function (data) {
setTimeout(function () { // Data is retrieved from the local page not from Online. So that, here setTimeOut used to show the WaitingPopup
$("#MVC").ejWaitingPopup('hide');
$('#MVC').html(data);
dataLoaded = true;
}, 3000);
},
});
}
}
</script> |
When the tab item is active, active() method is triggered. There we check if the data is already loaded and created an ajax request to get the contents of the URL. In the ajax beforeSend method we create an waiting popup for the tab item. On the ajax success method, we append the data into the tab item’s content and hide the waiting popup.
If you have any issues, please provide us a sample replicating your scenario. It will help us provide you solution.
Regards,
Prince
