Чередовать цвета строк / столбцов в GridView

Question

Предположим, у вас есть GridView с несколькими столбцами, такими как:

| Фу | Бар | Всего |

и вы используете таблицу стилей, чтобы сделать чередующиеся строки разными цветами, скажем, голубым и белым.

Есть ли хороший способ сделать так, чтобы определенный столбец чередовался с другим цветом? Например, я бы хотел, чтобы столбец Total чередовался в среднем и светло-красном цветах, чтобы привлечь внимание к нему в большой сетке.

Кстати, я знаю, что вы можете программно изменить цвет ячейки. Однако я бы хотел придерживаться CSS, если это возможно, поэтому все мои стилистические элементы находятся в одном месте. Я также не вижу простого способа определить, находится ли я в чередующемся ряду, когда нахожусь в обработчике событий.

Answer 1

Если вы используете jQuery, вы можете сделать это довольно легко.

$("table#myTable col:odd").css("background-color:#ffe");

Селектор :odd недоступен в большинстве современных браузеров, но jQuery предоставляет его нам сегодня.

Для строк вы можете сделать это с помощью встроенного элемента AlternatingRowStyle.

Редактировать: найден хороший ресурс для различных способов сделать это: http://css -discuss.incutio.com /? Page = StylingColumns

Answer 2

Я нашел это при поиске того же вопроса о WPF ListView GridView. Там ответом является использование StyleSelector, как этот , описанный Беа Коста:

public class ListViewItemStyleSelector : StyleSelector
{
    private int i = 0;
    public override Style SelectStyle(object item, DependencyObject container)
    {
        // makes sure the first item always gets the first style, even when restyling
        ItemsControl ic = ItemsControl.ItemsControlFromItemContainer(container);
        if (item == ic.Items[0])
        {
            i = 0;
        }
        string styleKey;
        if (i % 2 == 0)
        {
            styleKey = “ListViewItemStyle1″;
        }
        else
        {
            styleKey = “ListViewItemStyle2″;
        }
        i++;
        return (Style)(ic.FindResource(styleKey));
    }
}

Есть несколько гнид, которые нужно выбрать, чтобы это работало действительно хорошо, и все они описаны в ее блоге.

Единственное, что не поможет, это то, что это работает только для строк. Столбцы, кажется, всегда должны использовать CellTemplate / Style.

Answer 3

уходит на 2 касательных здесь ...

P.S. «также не вижу простого способа определить, нахожусь ли я в чередующемся ряду, когда нахожусь в обработчике событий».

Row.RowState == RowState.Alternating

Кроме того, вы всегда можете установить класс CssClass в соответствующих ячейках в ASP.NET, а затем определить этот класс в вашем CSS.

Answer 4

В дополнение к предложению Бена , у Мэтта Берсета также есть довольно хорошая демонстрация того, как сделать подсветку ролловеров при помощи GridViewControlExtender, что довольно неплохо:

http://mattberseth2.com/demo/Default.aspx?Name=GridViewControlExtender+II+-+Header+Cell+MouseOver+Styles+and+a+Few+More+Live+Examples&Filter=All

Существует также множество других вещей о том, как улучшить ваш GridView на его сайте:

http://mattberseth.com/blog/gridview/

В некоторых примерах используются биты ASP.NET Ajax и Ajax Control Toolkit, но их не слишком сложно портировать на облегченные эквиваленты jQuery.