This is a migrated thread and some comments may be shown as answers.

How to set cssclass for selected tiles in code-behind

6 Answers 113 Views
TileList
This is a migrated thread and some comments may be shown as answers.
Josh
Top achievements
Rank 1
Josh asked on 21 Jun 2013, 01:27 PM
Hello,
I have a TileList with several Tiles. Its skin is Black. I also have a Save button. I have a cssclass that changes the background image of selected tiles as following:

.RadTileList_Black .rtlistSelectedTile .rtlistSelectedIcon {
    background-image: url('Images/rtlistSpriteRed.png') !important;
}

This works fine for all the tiles. However, in my situation, I only need the set specific selected tiles to have that kind of style. For example, if only I need to change the style for tile 1 and 3 when they are selected. The others' style still has the original style. How can I do that in the code behind.

Thank you!

6 Answers, 1 is accepted

Sort by
0
Marin Bratanov
Telerik team
answered on 25 Jun 2013, 10:34 AM
Hi Josh,

The usual way to do this would be to apply a custom CssClass to the desired tiles and cascade through it to change the icon only for a selected tile with the custom class by also modifying the selector. The problem is that currently the CssClass property of the tile is not applied in the rendered HTML markup even when set. This is a known problem with the beta version of the control. You can follow its progress here. When it gets fixed your CSS would look like:
.RadTileList_Black .myCustomCssClass.rtlistSelectedTile .rtlistSelectedIcon {
background-image: url('Images/rtlistSpriteRed.png') !important;
}

and you could set the CssClass property of the desired tile. You can get all tiles with the server-side API of the control and loop through them. The tilelist offers the GetAllTiles and GetSelectedTiles methods that return lists of RadBaseTile objects.


Regards,
Marin Bratanov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
dhlennon
Top achievements
Rank 1
answered on 28 Jun 2013, 08:47 AM
Does this explain why I cannot change the mousepointer from css too?
0
Marin Bratanov
Telerik team
answered on 28 Jun 2013, 10:47 AM
Hello,

It depends on how you try to do it. If you use one of the CSS classed the control already has you will be able to change the pointer over, let's say, selected icon tiles:
.rtlistIconTile.rtlistSelectedTile
{
    cursor: crosshair !important;
}



Regards,
Marin Bratanov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
dhlennon
Top achievements
Rank 1
answered on 28 Jun 2013, 12:47 PM
Thanks for answering.

I merely want to change the mouse cursor to "pointer" when over the tile, regardless of selected/unselected or whether in normal or "peek" view. (basically to indicate it is akin to a hyperlink).

No problems at all if not possible in this build, don't want to waste time experimenting.

Thanks as always.
0
Marin Bratanov
Telerik team
answered on 28 Jun 2013, 12:55 PM
Hello,

Here are several selectors that match the main elements of the tiles:
.rtlistSquareTile,
.rtlistWideTile,
.rtlistContent,
.rtlistTopContent,
.rtlistPeekContent
{
    cursor: pointer !important;
}

Note that the cursor property is not inherited from the parent element and any element that is lower in the hierarchy will show its own cursor. So, the peekTemplate, being defined by the developer must be taken care of separately. The .rtlistPeekContent selector will select the main div we add, but further content down is the responsibility of the developer.

Regards,
Marin Bratanov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Josh
Top achievements
Rank 1
answered on 28 Jun 2013, 01:00 PM
Thank you!
Tags
TileList
Asked by
Josh
Top achievements
Rank 1
Answers by
Marin Bratanov
Telerik team
dhlennon
Top achievements
Rank 1
Josh
Top achievements
Rank 1
Share this question
or