c# - que - Cambiar las clases de CSS del código

selector padre css

Question

Es fácil configurar CssClass en el código subyacente, pero corre el riesgo de sobrescribir las clases existentes.

Necesito establecer ciertos elementos en ReadOnly = true; y me gustaría aplicar un estilo como una señal visual de que el elemento no puede ser alterado ... lo suficientemente fácil:

.CssClass += " ReadOnlyStyle";

Pero a veces también necesitaré cambiar el mismo elemento a ReadOnly = false; lo que significa que tendré que eliminar la clase de CSS que configuré sin eliminar ningún otro estilo que podría haber asignado.

¿Cuál es la mejor manera de hacer esto?

Answer 1

¿Puedes hacer tus propias clases personalizadas? Derive del botón ASP.NET y agregue un propert para solo lectura. En algún lugar ... probablemente en OnPreRender, puede verificar la nueva propiedad y establecer (o no establecer) la propiedad CSSClass en consecuencia.

Answer 2

En C # 3 puede agregar algunos métodos de extensión.

 static class WebControlsExtensions
 {
     public static void AddCssClass (this WebControl control, string cssClass)
     {
         control.CssClass += " " + cssClass;
     }
     public static void RemoveCssClass (this WebControl control, string cssClass)
     {
         control.CssClass = control.CssClass.replace(" " + cssClass, "");
     }
 }

Uso:-

ctl.AddCssClass("ReadOnly");
ctl.RemoveCssClass("ReadOnly");

Tenga en cuenta que RemoveCssClass está diseñado para eliminar solo aquellas clases agregadas por AddCssClass y tiene la limitación de que cuando se agregan 2 nombres de clase adicionales, el nombre más corto no debe coincidir exactamente con el inicio del nombre más largo. Por ejemplo, si agregó "prueba" y "prueba2", no puede eliminar la prueba sin dañar la clase CssClass. Esto podría mejorarse con RegEx por lo que espero que lo anterior sea adecuado para sus necesidades.

Tenga en cuenta que si no tiene C # 3, elimine this palabra clave del primer parámetro y use los métodos estáticos de la manera convencional.

Answer 3

Tomé el código original de AnthonyWJones y lo modifiqué para que funcione sin importar el escenario:

static class WebControlsExtensions
    {
        public static void AddCssClass(this WebControl control, string cssClass)
        {
            List<string> classes = control.CssClass.Split(new char[] { '' '' }, StringSplitOptions.RemoveEmptyEntries).ToList();

            classes.Add(cssClass);

            control.CssClass = classes.ToDelimitedString(" ");
        }

        public static void RemoveCssClass(this WebControl control, string cssClass)
        {
            List<string> classes = control.CssClass.Split(new char[] { '' '' }, StringSplitOptions.RemoveEmptyEntries).ToList();

            classes.Remove(cssClass);

            control.CssClass = classes.ToDelimitedString(" ");
        }
    }

    static class StringExtensions
    {
        public static string ToDelimitedString(this IEnumerable<string> list, string delimiter)
        {
            StringBuilder sb = new StringBuilder();
            foreach (string item in list)
            {
                if (sb.Length > 0)
                    sb.Append(delimiter);

                sb.Append(item);
            }

            return sb.ToString();
        }
    }

Answer 4

Esta versión comprueba para asegurarse de que la clase dada no se haya agregado antes de agregarla.

public static void CssAddClass(this WebControl control, string className)
{
    var classNames = control.CssClass.Split
        (new[] { '' '' }, StringSplitOptions.RemoveEmptyEntries);

    if (classNames.Contains(className))
    {
        return;
    }

    control.CssClass = string.Concat
        (classNames.Select(name => name + " ").ToArray()) + className;
}

public static void CssRemoveClass(this WebControl control, string className)
{
    var classNames = from name in control.CssClass.
                         Split(new[] {'' ''}, StringSplitOptions.RemoveEmptyEntries)
                     where name != className
                     select name + " ";


    control.CssClass = string.Concat(classNames.ToArray()).TrimEnd();
}

Answer 5

Hice una versión para pre-C # 3:

        public static class WebControlsExtensions
        {
            public static void AddCssClass(WebControl control, string cssClass)
            {
                string[] cssClasses = control.CssClass.Split(new char[] { '' '' }, StringSplitOptions.RemoveEmptyEntries);
                List<string> classes = new List<string>(cssClasses);

                if (!classes.Contains(cssClass)) {
                    classes.Add(cssClass);
                }

                control.CssClass = StringExtensions.ToDelimitedString(classes, " ");
            }

            public static void RemoveCssClass(WebControl control, string cssClass)
            {
                string[] cssClasses = control.CssClass.Split(new char[] { '' '' }, StringSplitOptions.RemoveEmptyEntries);
                List<string> classes = new List<string>(cssClasses);

                bool removed = true;
                while (removed) {
                    removed = classes.Remove(cssClass);
                }

                control.CssClass = StringExtensions.ToDelimitedString(classes, " ");
            }
    }
    static class StringExtensions {
        public static string ToDelimitedString(List<string> list, string delimiter)
        {
            StringBuilder sb = new StringBuilder();
            foreach (string item in list) {
                if (sb.Length > 0)
                    sb.Append(delimiter);

                sb.Append(item);
            }

            return sb.ToString();
        }
    }

Usado como:

WebControlsExtensions.AddCssClass(ctl, "classname");
WebControlsExtensions.RemoveCssClass(ctl, "classname");

Este solo agregará una clase si aún no está allí. También eliminará todas las instancias de una clase (si, por algún motivo, hay múltiples allí)

Answer 6

Pure .NET 2.0 (¡Sin extensiones, sin LINQ, sin RegEx! ¡Sin clases innecesarias de WebControl!). Estos métodos son bastante generales para ser utilizados no solo para clases de CSS.

Además, mira mi CssClassManipulator .

public static string AddCssClass(string classContainer, string className)
    {
        if (string.IsNullOrEmpty(classContainer)) return className ?? string.Empty;
        if (string.IsNullOrEmpty(className)) return classContainer;

        var classNames = classContainer.Split(new[] { '' '' }, StringSplitOptions.RemoveEmptyEntries);
        if (Array.Exists(classNames, delegate(string s) { return s.Equals(className); })) return classContainer;

        return classContainer + " " + className;
    }

    public static string RemoveCssClass(string classContainer, string className)
    {
        if (string.IsNullOrEmpty(classContainer)) return className ?? string.Empty;
        if (string.IsNullOrEmpty(className)) return classContainer;

        var classNames = classContainer.Split(new[] { '' '' }, StringSplitOptions.RemoveEmptyEntries);
        int index = Array.FindIndex(classNames, delegate(string s) { return s.Equals(className); });
        if (index >= 0)
        {
            return string.Join(" ", classNames, 0, index) +
                (   index + 1 < classNames.Length ?
                    " " + string.Join(" ", classNames, index + 1, classNames.Length - index - 1)
                    :
                    string.Empty    );
        }

        return classContainer;
    }

    public static string ToggleCssClass(string classContainer, string className)
    {
        if (string.IsNullOrEmpty(classContainer)) return className ?? string.Empty;
        if (string.IsNullOrEmpty(className)) return classContainer;

        var classNames = classContainer.Split(new[] { '' '' }, StringSplitOptions.RemoveEmptyEntries);

        if (Array.Exists(classNames, delegate(string s) { return s.Equals(className); })) return RemoveCssClass(classContainer, className);

        return classContainer + " " + className;
    }

Answer 7

Relacionado ... si solo quiere alternar una clase según una condición ...

bool disable = true;      // this will vary (true/false) based on UI state

string newClass = disable ? "BtnGray" : "BtnPink";

string currentClass = disable ? "BtnPink" : "BtnGray";

myButton.CssClass = myButton.CssClass.Replace( currentClass, newClass );