Styling af Gridview

Tags:    asp.net

Hej,
jeg har stylet mit gridview i RowCreated eventen og det virker også fint nok, bortset fra en ting. Når jeg vælger edit er det kun hver anden række det er stylet. Dvs. alternate rows bliver ikke stylet.

Mit css ser således ud:

.GridViewStyle tr.normal {background-color: #EBE5D5;color: #000000;}
.GridViewStyle tr.alternate {background-color: #EDEBE5;color: #000000;}
.GridViewStyle td.normal, .GridViewStyle td.alternate {border: 1px solid #000000; border-width: 0px 0px 0px 0px; border-style: none none none none;}
.GridViewStyle tr.selected {background-color: #DED6C4;font-weight: normal;color: #333333;}

Min RowCreated styler hver enkelt row:
protected void RolesGridView_RowCreated(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow && e.Row.RowState == DataControlRowState.Normal)
e.Row.CssClass = "normal";

if (e.Row.RowType == DataControlRowType.DataRow && e.Row.RowState == DataControlRowState.Alternate)
e.Row.CssClass = "alternate";

if (e.Row.RowType == DataControlRowType.DataRow && e.Row.RowState == DataControlRowState.Selected)
e.Row.CssClass = "selected";

if (e.Row.RowType == DataControlRowType.DataRow && e.Row.RowState == DataControlRowState.Edit)
e.Row.CssClass = "selected";
}

Nogle der ved hvad jeg enten gør galt/mangler i mit stylesheet eller i C# koden

Mvh

Rasmus



3 svar postet i denne tråd vises herunder
1 indlæg har modtaget i alt 3 karma
Sorter efter stemmer Sorter efter dato
Tror det er nemmer du laver et style sheet med det her indhold. også vælger du dit gridview, gå over i properties vinduet. helt ned i bunden ser du jo dem du gerne vil have fat i? AnternatingRowStyle, RowStyle, SelectedRowStyle
også bare sæt CssClass til den det skal være?
-------------- Style ----------------
normal
{background-color: #EBE5D5;
color: #000000;
border: 1px solid #000000;
border-width: 0px 0px 0px 0px;
border-style: none none none none;
}
alternate
{background-color:
#EDEBE5;color: #000000;
border: 1px solid #000000;
border-width: 0px 0px 0px 0px;
border-style: none none none none;
}
selected
{background-color:
#DED6C4;font-weight: normal;color: #333333;
}
---------------------------------------------




Udemærket forslag faktisk, men mig der har glemt et par detaljer kan jeg se nu <=)

Prøvede faktisk det du skriver til at starte med og det virkede også fint nok. Problemet var så, at jeg så ikke kunne få en hover-effect til at virke når musen er over en row.

Det lykkedes så ved at sætte styles i RowCreated eventen i stedet og I mit stylesheet bruger jeg så denne her til at lave hover-effecten:
.GridViewStyle tr.normal:hover, .GridViewStyle tr.alternate:hover {background-color:#9ADF93;color: #000000;}

Den effekt kan jeg nemlig ikke få til at virke, hvis jeg sætter styles på den måde du beskriver der. Har du evt. et forslag til hvordan hover-effecten så kan skrives?



Nå, fik faktisk løst det ved at kombinere de to måder.

Dvs. jeg sætter styles i RowCreated eventen i C# koden samt i selve html-delen også. Det sidste sørger for at opdatere GridView når man er i edit-mode eller man skifter væk fra en selected row.

Men ved at have sat styles i RowCreated eventen kan jeg bibeholde min hover-effect også.

Lidt bøvlet, men hva', det virker =)





t