Appliquer un style à un élément en particulier de mon Repeater ?

Bonjour à tous,

J'ai un menu de navigation gauche (secondaire) qui m'affiche mes sous-rubriques, avec un style particulier pour la sous-rubrique cliqué, il m'affiche les sous-sous-rub et les articles de ma sous-rubrique cliqué (idem si j'ai cliqué sur une ss-ss-rubrique ou un article).
Particularité importante ce menu, se construit indépendemment pour chaque page (il est dans le contenu) ...

Voici la structure de ce menu :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 <div id="nav" class="nav"> <ul> <asp:Repeater runat="server" ID="rSHead"> <ItemTemplate> <li><a href='<%#((SbHead)Container.DataItem).Tmp%>?id=<%#((SbHead)Container.DataItem).Id%>'><span><%#((SbHead)Container.DataItem).LblSH %></span></a></li> <ul> <asp:Repeater runat="server" ID="rSSHead" DataSource='<%#((SHead)Container.DataItem).SSHead %>'> <ItemTemplate> <li><a href='<%#((SSHead)Container.DataItem).Tmp %>'><span><%#((SSHead)Container.DataItem).LblSSHead %></span></a></li> <ul> <asp:Repeater runat="server" ID="rAtSSR"> <ItemTemplate> <li><a href="#"><span>test</span></a></li> </ItemTemplate> </asp:Repeater> </ul> </ItemTemplate> </asp:Repeater> </ul> </ItemTemplate> </asp:Repeater> </div>
Ma question est, comment puis-je donner le style séléctionné (modifier le style) au bon élément de mon Repeater ? En utilisant le Data-Bound et parcourant tout mes éléments ?

Si vous trouvez que je m'y suis mal pris ou que vous avez une meilleure piste, n'hésitez pas à m'en faire part ...

Merci d'avance.

Je ne sais pas si je comprends bien ton truc
Est ce que faire ceci te convient :
Code:

1 2 class='<%# ((SbHead)Container.DataItem).Id == IdSelectionne)?"normal":"selection"%>'
IdSelectionne étant un accesseur (get) dans ton code behind.

Si cela ne convient, pourrais tu donner le code html que tu desires avoir

Merci beaucoup pour ta réponse

Tu m'as donnée une piste que je suis entrain d'explorer, mais ça me parait un peu complexe (j'ai découvert d'autre travers :aie: ), par exemple pour l'élément sélectionné je n'ai plus de <a href="#"> mais un span avec un style.

Dans l'absolue voici le html que je voudrais avoir :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<li class="first"><a href="#"><span>RANGE</span></a></li>
            <li><span class="selected-sub"><span>Product</span></span>
                <ul>
                    <li><a href="#"><span>CD</span></a></li>
                    <li><a href="#"><span>DVD</span></a></li>
                    <li><a href="#"><span>DVD6</span></a></li>
                    <li><a href="#"><span>DVD7</span></a></li>
                    <li><a href="#"><span>DVD8</span></a></li>
                    <li><a class="selected" href="#"><span>DVD8</span></a>
                        <ul>
                            <li><a href="#"><span>DVD8 Top of the Range!</span></a></li>
                            <li><span class="selected"><span>DVD8 Sport just &pound;13,445!</span></span></li>
                            <li><a href="#"><span>DVD8 Contract</span></a></li>
                            <li><a href="#"><span>DVD8 Prestigious</span></a></li>
                            <li><a href="#"><span>New DVD colelctor here!</span></a></li>
                            <li class="last"><a href="#"><span>DVD 24 Test !</span></a></li>
                        </ul>
                    </li>
                    <li><a href="#"><span>DVD007</span></a></li>
                    <li><a href="#"><span>DVD07</span></a></li>
                    <li><a href="#"><span>DVD7</span></a></li>
                    <li><a href="#"><span>DVD</span></a></li>
                    <li><a href="#"><span>Les Experts</span></a></li>
                </ul>
            </li>
            <li><a href="#"><span>EXAMPLE<br />
                TWO LINES</span></a></li>
            <li><a href="#"><span>VANEGER</span></a></li>
            <li class="last"><a href="#"><span>STORE</span></a></li>

Avec les style :

Code:

1
2
3
4
.nav2 ul li span.selected-sub{
padding:0;
background:url(../img/nav2-sel-bg.gif) bottom no-repeat;
}

Code:

1
2
3
4
5
6
.nav2 ul li.first a, .nav2 ul li.first span.selected{
background:url(../img/nav2-top.gif) no-repeat #347ec7;
margin:-2px 0 0 0;
position:relative;
padding:2px 0 0 0;
}

C'est de pire en pire (différence entre Firefox et ie ...) y a quelqu'un qui aurait un avis ?