Grid customise progress indicator image

[Mark]

Hi there,

How do you customise the image on the loading spinner for a Kendo Grid?  I have an animated gif called 'loading.gif' that I wish to use instead of the default image currently.

Thanks, Mark

[Patrick | Technical Support Engineer, Senior]

Hi Mark,

Take a look at this sample illustrating how to change the loading spinner.  

I changed the background-image of the class k-loading-image:

<style>
.k-loading-image
  {
    background-image:url('http://i.forbesimg.com/assets/img/loading_spinners/43px_on_transparent.gif')
  }
</style>

Regards,
Pat
Telerik

 

 

[Mark]

Worked perfectly, thanks!

Mark

[Surbhi]

Hi Team,

How can I use an inline SVG instead of an image, as the loading circle for kendo grids and tabs?

Regards,

Surbhi Jain

[Patrick | Technical Support Engineer, Senior]

Hello Surbhi,

One approach you can take is the implementation shown in this stackOverflow post.  I've created a small demo in a Progress Kendo UI Dojo which when selecting a tab in a TabStrip will show the loading symbol, and when the Grid loads data.  

Regards,
Patrick
Progress Telerik