Saltar al contenido

¿Cómo seleccionar un elemento por Clase en lugar de ID en ASP.NET?

La guía o código que hallarás en este artículo es la resolución más sencilla y válida que encontramos a tu duda o problema.

Solución:

La cosa es bastante fácil. En su ASPX:

En tu código subyacente:

protected void Paragraph_PreRender(object sender, EventArgs e)

  Control paragraph = (Control)sender;
  paragraph.Visible = !paragraph.CssClass.Contains("instructions");

El código subyacente se conectará automáticamente al controlador de eventos PreRender en su clase. Esto envía al remitente al control y establece su Visibilidad en función de la clase css. Solo tiene que ajustar las etiquetas y no necesita mucho código para atravesar su colección de control.

Además de agrupar todos los controles en un solo control de contenedor, no existe una manera fácil de encontrar un grupo de controles con alguna propiedad en el código del lado del servidor ASP.NET.

En el lado del cliente, podría usar algo como jQuery para encontrar estos elementos y ocultarlos:

$(".instructions").hide();

Probablemente haría esto en respuesta cuando la página esté completamente cargada:

$(document).ready(function()  
   $(".instructions").hide(); 
);

Una desventaja de ocultar elementos en Javascript es que, si hay suficientes datos, puede tardar un segundo y hacer que el contenido parpadee. Otra diferencia es que ocultar el contenido del lado del cliente no elimínelo del DOM: el contenido simplemente está oculto. Ocultar los controles del lado del servidor evita que su contenido se emita al HTML.

Hacer lo mismo en C# es un poco más difícil: requiere atravesar recursivamente el árbol de control y buscar elementos en el Control colección que coincida. Esta es una operación lo suficientemente común como para que una función de utilidad sea útil. La sintaxis del iterador de C# (retorno de rendimiento) es útil para limpiar esto:

// utility method to recursively find controls matching a predicate
IEnumerable FindRecursive( Control c, Func predicate )

    if( predicate( c ) )
        yield return c;

    foreach( var child in c.Controls )
    
        if( predicate( c ) )
            yield return c;
    

    foreach( var child in c.Controls )
        foreach( var match in FindRecursive( c, predicate ) )
           yield return match;


// use the utility method to find matching controls...
FindRecursive( Page, c => (c is WebControl) && 
                          ((WebControl)c).CssClass == "instructions" );

Ocultar los controles ahora es relativamente fácil:

foreach( WebControl c in FindRecursive( Page, c => (c is WebControl) && 
                           ((WebControl)c).CssClass == "instructions" ) )

    c.Visible = false;

Quiero responder a una de las primeras respuestas, donde estamos usando la recursividad para pasar por todos los controles. En primer lugar, ¿no deberíamos recurrir a los elementos secundarios? No miré de cerca el código y vi que seguíamos llamando al método recursivamente en “c”, no en “child”. En segundo lugar, descubrí que ninguno de los elementos de mi página web se podía enviar a WebControl, solo a HtmlGenericControl.

Después de editar, me quedó esto:

    // utility method to recursively find controls matching a predicate
    IEnumerable FindRecursive( Control c, Func predicate )
    
        if( predicate( c ) )
            yield return c;

        foreach (var child in c.Controls) 
            if (predicate((Control)child)) 
               yield return (Control)child;
            
        

        foreach( var child in c.Controls )
            foreach( var match in FindRecursive( (Control)child, predicate ) )
               yield return match;
    

    foreach (Control c in FindRecursive(Page, c => (c is HtmlGenericControl) &&
         ((HtmlGenericControl)c).Attributes["ishidden"] == "1"))
    
         c.Visible = false;
    

Tenga en cuenta que no pude usar “CssClass”, tuve que poner el mío attribute (‘ihidden’) para llegar a esto para trabajar.

...

Estoy usando ASP.NET framework 2.0/3.0/3.5.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *