Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 531
  • Last Modified:

Gridview alternate shading, c# codebehind

I use the following code for conditional formatting on gv1 (it works ok). I want to apply alternate row-shading on a different gridview basically using a modified version of the following code.

Question: How can I revise this code to apply alternate row-shading on new gridview (gv2)?

Thank you.
  protected void gv1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.Header)
        {
            e.Row.CssClass = "headerBracketGround";
        }
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
           e.Row.CssClass = "highlightBracketground";
           var val = e.Row.Cells[2].Text;
          var snglVal = Single.Parse(val);
          e.Row.CssClass = snglVal > 0.0 ? "highlightBracketground" : "bracketground";
        }
    }

Open in new window

0
Mike Eghtebas
Asked:
Mike Eghtebas
  • 4
  • 4
  • 3
2 Solutions
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
You use nth child: odd
https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-child

I can give a better example later
0
 
Shaun KlineLead Software EngineerCommented:
If you only care about alternating colors, you can assign a CSS style to the alternating row as such:
<asp:gridview id="YourGridView" runat="server">        
    <RowStyle CssClass="Row" />
    <AlternatingRowStyle CssClass="AltRow" />
</asp:gridview>

Open in new window

0
 
Mike EghtebasDatabase and Application DeveloperAuthor Commented:
Scott Fell (padas),
Not helpful.

Shaun Kline,
I am looking for codebehind solution.
---------

Thanks
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
Shaun KlineLead Software EngineerCommented:
If you wish to use a code method, you need only change
 if (e.Row.RowType == DataControlRowType.DataRow)
{
...
}

Open in new window

block of code to use the e.Row.RowIndex property and the modulus routine to determine which row gets the normal CSS style and which row gets the alternating CSS style.
0
 
Shaun KlineLead Software EngineerCommented:
The code would look something like this:
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.CssClass = e.Row.RowIndex % 2 == 1 ? "alternatingCSSStyle" : "normalCSSStyle";
}

Open in new window

0
 
Mike EghtebasDatabase and Application DeveloperAuthor Commented:
I was looking for   e.Row.CssClass = e.Row.RowIndex % 2 == 1 ?...

brb
0
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Sorry that didn't work for you.  This is really a front end issue.  It is much easier to think of your rendered output.


You end up with a table like below and add the following css and your good as shown in this sample http://jsbin.com/necipi/1/edit?html,output.
 tr:nth-child(even){background-color:#ccc;}

Open in new window

<table id="abc">
    <tr>
      <td>row 1</td>
    </tr>

    <tr>
      <td>row 1</td>
    </tr>

    <tr>
      <td>row 1</td>
    </tr>

    <tr>
      <td>row 1</td>
    </tr>

    <tr>
      <td>row 1</td>
    </tr>

    <tr>
      <td>row 1</td>
    </tr>

    <tr>
      <td>row 1</td>
    </tr>

    <tr>
      <td>row 1</td>
    </tr>

    <tr>
      <td>row 1</td>
    </tr>
  </table>

Open in new window

0
 
Mike EghtebasDatabase and Application DeveloperAuthor Commented:
Thank you.

Scott Fell (padas), I was looking for codebehind in c#.

in the aspx file, i will have no more than:
  <form id="form1" runat="server">
    <div>
    <asp:GridView runat="server" ID="grdHighLight"  onrowdatabound="grdHighLight_RowDataBound" CellSpacing="-1" GridLines="None" >
            
    </asp:GridView>
    </div>
    </form>

Open in new window


I mean no <table>, <tr> etc.
0
 
Shaun KlineLead Software EngineerCommented:
I agree with Scott that this should be handled in the front-end page, and not in the code behind. The main reason is that if you ever need to use a different style class, you need to re-code and re-deploy, while using a CSS approach or "coding" the CSS into your aspx page would not necessarily require a re-deployment of the entire application, just the parts that changed.

One note: the nth-child is a CSS3 enhancement. If you need to support older browsers, it may not work for you. (http://www.w3schools.com/cssref/sel_nth-child.asp)
0
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
I think it is safe to not support ie7 and below at this point unless your client is a business with mostly XP and no plans to change any time soon.  http://caniuse.com/#search=nth-child
0
 
Mike EghtebasDatabase and Application DeveloperAuthor Commented:
The issue is that, I have to create the gridview using code behind as opposed to have it done my gridview control on the toolbar. This is because, using gridview control from toolbar, returns lots on inline css that html5 doesn't like.
'
So, in order for me to have html5 complaint project, I have to have all gridview related tags (except a single tage I showed before) in codebehind.

Of course, if any cahnges later, I do it from css file.

Mike
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

  • 4
  • 4
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now