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

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

| Фу | Бар | Итого |

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

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

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


gridview css asp.net
person Dana Robinson    schedule 24.11.2008    source источник

Ответы (4)


arrow_upward
4
arrow_downward

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

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

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

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

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

person Ben Scheirman    schedule 24.11.2008

arrow_upward
0
arrow_downward

В дополнение к предложению Бена у Мэтта Берсета также есть неплохая демонстрация. о том, как сделать подсветку столбцов при наведении курсора, используя 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.

person Kev    schedule 24.11.2008

arrow_upward
0
arrow_downward

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

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

Row.RowState == RowState.Alternating

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

person Jimmy    schedule 24.11.2008

arrow_upward
0
arrow_downward

Я нашел это при поиске того же вопроса относительно 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));
    }
}

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

Одна вещь, которая не поможет, - это то, что это работает только для строк. Столбцы, кажется, всегда должны использовать _5 _ / _ 6_.

person David Schmitt    schedule 10.12.2008