web-dev-qa-db-fra.com

C # - Comment changer les attributs des éléments HTML

Ma page maître contient une liste comme indiqué ici. Ce que j'aimerais cependant faire, c’est d’ajouter l’attribut "class = active" à la liste des liens actifs, mais je ne sais pas comment faire cela. Je sais que le code va dans l'événement page_load de la page aspx, mais je ne sais pas comment accéder au li. J'ai besoin d'ajouter l'attribut. S'il te plaît, éclaire-moi. Merci beaucoup.

<div id="menu">
  <ul id="nav">
    <li class="forcePadding"><img src="css/site-style-images/menu_corner_right.jpg" /></li>               
    <li id="screenshots"><a href="screenshots.aspx" title="Screenshots">Screenshots</a></li>
    <li id="future"><a href="future.aspx" title="Future">Future</a></li>
    <li id="news"><a href="news.aspx" title="News">News</a></li>
    <li id="download"><a href="download.aspx" title="Download">Download</a></li>
    <li id="home"><a href="index.aspx" title="Home">Home</a></li>
    <li class="forcePadding"><img src="css/site-style-images/menu_corner_left.jpg" /></li>
  </ul>
</div>
c#htmlasp.net
17
Vince Panuccio

Pour accéder à ces contrôles du côté serveur, vous devez les rendre runat = "server"

<ul id="nav" runat="server">
  <li class="forcePadding"><img src="css/site-style-images/menu_corner_right.jpg" /></li>               
  <li id="screenshots"><a href="screenshots.aspx" title="Screenshots">Screenshots</a></li>
  <li id="future"><a href="future.aspx" title="Future">Future</a></li>
  <li id="news"><a href="news.aspx" title="News">News</a></li>
  <li id="download"><a href="download.aspx" title="Download">Download</a></li>
  <li id="home"><a href="index.aspx" title="Home">Home</a></li>
  <li class="forcePadding"><img src="css/site-style-images/menu_corner_left.jpg" /></li>
</ul>

dans le code-behind:

foreach(Control ctrl in nav.controls)
{
   if(!ctrl is HtmlAnchor)
   {
      string url = ((HtmlAnchor)ctrl).Href;
      if(url == GetCurrentPage())  // <-- you'd need to write that
         ctrl.Parent.Attributes.Add("class", "active");
   }
}
27
Ben Scheirman

Le code ci-dessous peut être utilisé pour trouver un contrôle nommé n'importe où dans la hiérarchie des contrôles:

public static Control FindControlRecursive(Control rootControl, string id)
{
    if (rootControl != null)
    {
        if (rootControl.ID == id)
        {
            return rootControl;
        }

        for (int i = 0; i < rootControl.Controls.Count; i++)
        {
            Control child;

            if ((child = FindControlRecursive(rootControl.Controls[i], id)) != null)
            {
                return child;
            }
        }
    }

    return null;
}

Pour que vous puissiez faire quelque chose comme:

Control foundControl= FindControlRecursive(Page.Master, "theIdOfTheControlYouWantToFind");
((HtmlControl)foundControl).Attributes.Add("class", "active");

Oublié de mentionner précédemment que vous avez besoin de runat = "serveur" sur tout contrôle que vous voulez pouvoir trouver de cette façon =)

4
Rob

Ajoutez runat = "server" sur les balises li dans la page maître puis ajoutez-le à l'événement page_load approprié pour ajouter la classe 'active' à la page li dans la page maître

HtmlGenericControl li = HtmlGenericControl) Page.Master.FindControl ("screenshots"); Li.Attributes.Add ("class", "active");

2
Bevan

Vous pouvez enregistrer un script client comme ceci:

(définissez id sur l'id du li que vous souhaitez définir comme actif)

ClientScript.RegisterStartupScript(this.GetType(), "setActiveLI", "document.getElementById(\""+id+"\").setAttribute(\"class\", \"active\");", true);

Cela génère un appel JavaScript sur la page proche du bas après le rendu des éléments.

1
Lou Franco

Toutes les parties ont déjà été fournies dans les réponses précédentes, mais pour tout comprendre, vous devez:

  • ajoutez l'attribut runat = "server" aux éléments <ul> et <li>
  • ajoutez une méthode publique pour effectuer le travail sur la page maître qui peut être appelé à partir des pages à l'aide de la page maître
  • appelez la méthode à partir du Page_Load des pages

    Sinon, vous pouvez également ajouter le code à la méthode OnLoad (...) de la page maître, de sorte que vous ne soyez pas obligé d'ajouter l'appel de méthode à Page_Load sur chaque page.

    • 1
    csgero

    S'ils étaient runat = serveur, vous pouvez utiliser la propriété d'attributs.

    0
    Adam Naylor

    Afin de trouver ce contrôle particulier, il devra être défini comme public (dans le concepteur généré).

    Ou devra être enveloppé par un public entrer dans le codebehind.

    0
    Adam Naylor

    Vous pouvez exposer les liens de la page maître à toutes les pages de contenu en les enveloppant dans des propriétés de la page maître:

    public GenericHtmlControl Li1
{
    get
    {
        return this.LiWhatever;
    }
}

    Puis sur la page de contenu:

    MasterPage2 asd = ((MasterPage2)Page.Master).Li1.Attributes.Add("class", "bla");

    Si j'ai bien compris!

    0
    Adam Naylor

    Merci pour la solution.

    Code minuscule.

    Le contrôle de page maître peut également être trouvé dans la page enfant.

    je veux dire la page principale contient html contol

    et chilld page peut trouver la page maître HTML control comme celle-ci

    ((HtmlControl)this.Master.FindControl("dpohome1")).Attributes.Add("class", "on");
    0
    shivanand nagarabetta

    Essayez ceci Le bon exemple pour une utilisation future. Je sais que ce fil est ancien, mais pour les futures requêtes ...

    http://community.discountasp.net/showthread.php?p=33271

    0
    sus2bhai

    J'ai trouvé un lien qui fonctionne à l'aide de CSS et implique uniquement de modifier l'attribut de classe de la balise body. Cela signifie qu'il n'y a pas de Javascript et qu'il n'y a pas de boucles ou quoi que ce soit.

    #navbar a:hover,
  .articles #navbar #articles a,
  .topics #navbar #topics a,
  .about #navbar #about a,
  .contact #navbar #contact a,
  .contribute #navbar #contribute a,
  .feed #navbar #feed a {
 background: url(/pix/navbarlinkbg.gif) top left repeat-x; color: #555;
}

....

<body class="articles" onload="">

<ul id="navbar">
  <li id="articles"><a href="/articles/" title="Articles">Articles</a></li>
  <li id="topics"><a href="/topics/" title="Topics">Topics</a></li>
  <li id="about"><a href="/about/" title="About">About</a></li>
  <li id="contact"><a href="/contact/" title="Contact">Contact</a></li>
  <li id="contribute"><a href="/contribute/" title="Contribute">Contribute</a></li>
  <li id="feed"><a href="/feed/" title="Feed">Feed</a></li>
</ul>

    Lire la suite ici http://www.websiteoptimization.com/speed/Tweak/current/

    0
    Vince Panuccio