Completed
Last Updated: 26 Jun 2021 16:28 by ADMIN
David
Created on: 24 Jun 2021 22:00
Category: Loader
Type: Feature Request
2
Add a label to Loader
We often need to add some sort of loading message next to the Loader component. "Loading records..." or "Loading...please wait" or something like that. It would be very handy if the Loader component had a parameter that would set this message, and another parameter to set the location (above, left, right, below).
1 comment
ADMIN
Marin Bratanov
Posted on: 26 Jun 2021 16:28

Hello David,

The loader is basically an icon, so you can put any other text and layout you want around it. You can see one example here where the loader is integrated into other layout (in this case, next to the text of a button).

Here's another example I made for you:

<TelerikButton Primary="true" OnClick="@GenerateReport" Enabled="@(!Visible)">
    Generate Report
</TelerikButton>
@if (Visible)
{
    <TelerikLoader Visible="@Visible"></TelerikLoader>
    <span>Please wait, loading</span>

    @* You can add any desired layout to this section, in case the LoaderContainer component does not suit your needs
        You can even use things like the grid and stack layout components we have to arrange things
        https://demos.telerik.com/blazor-ui/stacklayout/overview
        https://demos.telerik.com/blazor-ui/gridlayout/overview*@
}


@code {
    bool Visible { get; set; }

    async Task GenerateReport()
    {
        Visible = true;
        await Task.Delay(2000);
        Visible = false;
    }
}

We also have the Loader Container component that comes with a more complex layout and offers options like text, positioning of the text (see examples) and also with customizable template where you can put your own content.

With this in mind, I am marking this as "completed" because we have several options (one of them completely ready-to-use - the LoaderContainer component) and adding more settings like that to the loader will basically make it equivalent to the loader container.

Regards,
Marin Bratanov
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.