c# - modificar - setattribute javascript
C#- Cómo cambiar los atributos de los elementos HTML (11)
Mi página maestra contiene una lista como se muestra aquí. Sin embargo, lo que me gustaría hacer es agregar el atributo "class = active" a la lista li que está activa actualmente, pero no tengo ni idea de cómo hacer esto. Sé que el código va en el evento page_load de la página aspx, pero no tengo idea de cómo acceder al li. Necesito agregar el atributo. Por favor iluminame. Muchas gracias.
<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>
El siguiente código se puede usar para buscar un control con nombre en cualquier lugar dentro de la jerarquía de control:
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;
}
Entonces podrías hacer algo como:
Control foundControl= FindControlRecursive(Page.Master, "theIdOfTheControlYouWantToFind");
((HtmlControl)foundControl).Attributes.Add("class", "active");
Se olvidó mencionar anteriormente, que necesita runat = "servidor" en cualquier control que quiera poder encontrar de esta manera =)
Para encontrar ese control particular, deberá definirse como público (en el diseñador generado)
O tendrá que ser envuelto por un público en el código detrás.
Puede exponer las li de la página maestra a cualquier página de contenido enviándolas en propiedades en la página maestra:
public GenericHtmlControl Li1
{
get
{
return this.LiWhatever;
}
}
Luego en la página de contenido:
MasterPage2 asd = ((MasterPage2)Page.Master).Li1.Attributes.Add("class", "bla");
Si lo tengo bien!
Puede registrar un script de cliente como este:
(establezca id en el id del li que desea establecer en activo)
ClientScript.RegisterStartupScript(this.GetType(), "setActiveLI", "document.getElementById(/""+id+"/").setAttribute(/"class/", /"active/");", true);
Esto genera una llamada de JavaScript en la página cerca de la parte inferior después de que los elementos ya se hayan procesado.
Si fueran runat = servidor, podría usar la propiedad de atributos.
Todas las partes ya han sido provistas en respuestas anteriores, pero para armar todo, necesitarás:
<ul>
y <li>
Alternativamente, también podría agregar el código al método OnLoad (...) de la página maestra, de modo que no tenga que agregar la llamada al método a Page_Load en cada página.
Encontré un enlace que funciona con CSS e implica solo cambiar el atributo de clase de la etiqueta del cuerpo. Esto significa que no hay Javascript y no hay bucles para nada.
#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>
Lea más aquí http://www.websiteoptimization.com/speed/tweak/current/
Agregue runat = "server" en las etiquetas li en la página maestra y luego agregue esto al evento page_load apropiado para agregar la clase ''active'' a la li en la página maestra
HtmlGenericControl li = HtmlGenericControl) Page.Master.FindControl ("capturas de pantalla"); li.Attributes.Add ("clase", "activo");
Pruebe este el gran ejemplo para uso futuro. Sé que este hilo es viejo, pero para futuras consultas ...
Para acceder a estos controles desde el lado del servidor, debe hacer que 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>
en el código subyacente:
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");
}
}
Gracias por la solución.
Código Mininizado.
El control de página maestra también puede encontrarlo en la página secundaria.
me refiero a la página maestra contiene html contol
y la página chilld puede encontrar la página maestra html conrol como este
((HtmlControl)this.Master.FindControl("dpohome1")).Attributes.Add("class", "on");