ComponentOne GridView for ASP.NET WebForms
Task-Based Help / Formatting the Grid's Content / Setting Alternate Row Styles
In This Topic
    Setting Alternate Row Styles
    In This Topic

    This topic demonstrates how to change the color of alternating rows of a C1GridView.

    In the Designer

    Complete the following steps:

    1. Drag and drop a C1GridView control onto your Web Form.
    2. Add data to the C1GridView. For more information, see Binding the Grid to a Data Source.
    3. Click OK.

    In Source View

    To change the color of alternating rows, add the following code between the <head> </head> tags as shown below:

    <style type = "text/css">
    // Set the color of alternating rows
    .wijmo-wijgrid-alternatingrow
    {
    background-color:pink!important;
    }
    </style>

    In CSS

    By default, the “aristo” theme supports alternate row coloring in C1GridView. In order to modify any existing theme to get alternate row styles follow the steps below:

    1. Open the CSS file of the theme to be modified from the following link:
      http://wijmo.com/theming/
    2. Create a new file in a text editor and copy the contents of the theme’s CSS file. Modify the code to set the color of the alternating rows as defined above under In Source View heading.
    3. Save the file with “.css” extension.
    4. Add the CSS file into your project.
    5. Link the CSS file by adding the following code within the <head></head> tags in the source view as shown below:
    <link rel=”stylesheet” type=”text/css” href=”name.css”>
    
    Note: The stylesheet is the CSS file inside the “custom-theme” folder.

    What You've Accomplished

    When you run the project, the color of alternating rows is changed.


    See Also