Dynamically display both text and animation with kendo.ui.progress

[Donny]

Hello,

I have been able to add text to the kendo.ui.progress with the below JQuery and CSS. However, there are only certain times when processing an AJAX operation that I would like to display text and animation via kendo.ui.progress. Is there a way to clear the "loading" message after the ajax call is complete?

kendo.ui.progress.messages = {
      loading: "Processing file remittance. Please wait.."
};
kendo.ui.progress($("body"), true);

span.k-loading-text {
    font-size: 1.1rem;
    text-indent: 0;
    top: 55%;
    display: inline-block;
    padding: 5px;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #555;
}

[Neli]

Hello Donny,

If you need to change the text at runtime, you could use the 'k-loading-text' class and set different text to it as in the example below:

 $(".k-loading-text").text('Custom')

In case you need to hide the loader, you could use the progress method:

 kendo.ui.progress(element, false);

I hope you will find the provided information helpful. Let me know in case you have additional questions.

Regards,
Neli
Progress Telerik