Last Updated: 21 Apr 2022 11:56 by ADMIN
Created on: 13 Apr 2022 22:34
Category: TileLayout
Type: Feature Request
Able to drag tile on empty spaces on TelerikTileLayout


Is there a way we could drag the tile on those empty spaces in the tile layout? I've tried the samples in your page and it seems reorderable only reorders the tiles. Is it possible to put an option that we might be able to drag those tiles to the empty spaces instead of dragging them to another tile to switch places? See attached file as reference on what I meant.

Posted on: 21 Apr 2022 11:56

Hello Leonardo,

I understand your requirements and I am sorry the TileLayout cannot fulfil them.

Basically, you need a Dock component, which has the discussed different behavior.

A possible workaround for your case might be:

  • Make all tiles the same width and height.
  • Use invisible tiles for the initial empty spaces.

In this way users will be able to drag and drop on seemingly empty spaces. If this doesn't meet your requirements, then the only remaining suggestion is to consider another solution.

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.

Posted on: 20 Apr 2022 20:26

Dear Dimo,


We will need to change this behaviour. Our sponsor is reluctant against this current behaviour and he wants to leave an empty space in the middle of the screen and arrange the tiles in the borders. Please, consider implementing a parameter where the tiles can be dragged wherever they want to as long as there is an empty space (slot) where the tile can be fitted. I need urgently an alternative for that, otherwise, I'll have to find another component or build one by myself. Please, let us know if that would be possible to be implemented or not and, if so when it will be released.


Kind regards,

Leonardo Willrich.

Posted on: 19 Apr 2022 12:33

Hi Adrian,

I agree that the described scenario looks logical from user's perspective. Let's review it from technical perspective too.

The main issue with the provided example is that the desired reordering is invalid. The component is configured with 3 columns, while the drag action is trying to make them just 2 and leave the 3rd one empty. That's why the component doesn't allow it.

A related unsupported layout is this one (assuming 3 columns):

[ Tile 1.1 ]  [ Tile 1.2 ]  [ Tile 1.3 ]
[ Tile 2.1 ]  [ Tile 2.2 ]  [ Tile 2.3 ]
[ Tile 3.1 ]                    [ Tile 3.3 ]

In this case, Tile 3.3 will always end up under 2.2.

So in general, empty spaces in the TileLayout do not guarantee the user can drop a tile there. The current behavior helps the user preview the resulting layout after reordering and confirm which tiles exactly to move around.

Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at