Found out that IE was running in quirks mode.

Fixing it (setting the proper doctype for the html page) and defining my own altclass fixed it.

There is a such option for this  - read here:

http://www.trirand.com/jqgridw.....ki:options

Regards

Tony

Check to see in FireBug if you have in the rows the class "ui-priority-secondary" if altrows is true.

If you have this class the the undelaing theme does not have diffrent colors for the altrows.

Also which version do you use?

Best Regards

Tony

altRows = true

It looks like I have the same problem...

Tom

Tom

The link you provided is not working.  Get the following web page:

Looking forward to eventually seeing the alternating rows.  For now, I will continue my development and hold off on that feature until I know it should be workin.

Thanks again.

Tom

Error Summary

HTTP Error 404.0 - Not FoundThe resource you are looking for has been removed, had its name changed, or is temporarily unavailable.

http://www.trirand.net/example..... 

and choosing UI Darkness from themes, the alternating background is clearly visible for the aforementioned browsers and hardly visible (I think only the foreground color is a bit different, but not background). 

This seems like something we will need to look after and fix (but this could be manually fixed problably, by employing a technique suggested before in this thread, like manually changing the selectors for altRows).

We will look into this in detail and address that. Please, excuse us for the inconvenience.

Regards,

Rumen Stankov

When I run the trirand test page, I do not see alternating colors.

Tom

Rumen:  Okay.  I will look at the example.  Site is internal and use IE but I will try to download a copy of Firefox and Firebug and see if that helps with my debugging.  Will probably not be able to get to it today so will be tomorrow at latest before I can reply.

But thanks for everyone hanging in with suggestions and support.  I extremely impressed with jqGrid (and jQuery in general) and am determined to work my way through this.

Tom

http://www.trirand.net/example.....fault.aspx

Please, take a look at it and experiment with all the Themes available (25 of them) in the "Themes" tab below the example. You will notice that some theme roller themes do not support altRows, some do, some have very hardly visible differences.

Also, run FireBug for FireFox and check out how our setup is different from yours. Another thing to watch for - which version are you using? Please, try the very last official release (I believe 3.5.3 if I am not mistaken, 3.6 is still in beta).

Hopefully we can work this out.

Rumen Stankov

If you have Firefox web developer extension installed, check the generated source of your jqgrid by right clicking your page: Web Developer - View Source - View generated source. There you can see if the CSS classes are added to the alternating rows of your jqgrid, and also what the name of the class is.

Second, I also attempted to set the background color to red as suggested above.  This also did not work.

Tom

There was a bug when we use datatype local (already fixed), but this is not your case. In some themes there is no diffrence with the alt rows, by example redmond. Try with other theme and see the result.

Regards

Tony

I have tried using single and double quotes around altRow in the javascript.  I have tried Vader for the theme.  I have tried Redmond.  All three work but none of them show.  I have tried putting the css for red background in the site.css file.  While the jqGrid shows everything correct but the altRow coloring.  So the problem must be in the CSS but I don't see it.

I have to say, while I love jQuery and especially jqGrid, troubleshooting the styling is hit and miss.  I sure wish there was a say to troubleshoot CSS structure and see what has been pulled in.

    <link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
   <link href="<%= Url.Content("~/Scripts/jqGrid/themes/smoothness/jquery-ui-1.7.2.custom.css") %>" rel="stylesheet" type="text/css" />   
    <!-- This css link must match the name (here: smoothness) used in the imgpath for the jqGrid -->
    <link href="<%= Url.Content("~/Scripts/jqGrid/themes/smoothness/ui.all.css") %>" rel="stylesheet" type="text/css" />   
    <link href="<%= Url.Content("~/Scripts/jqGrid/themes/ui.jqGrid.css") %>" rel="stylesheet" type="text/css" />   
<style type="text/css" >
 .ui-jqgrid .altRow td{background-color: red;}
</style>

    <div id="gridwrapper">
        <div id="search"></div>
        <table id="grid" class="scroll" cellpadding="0" cellspacing="0"></table>
        <div id="pager" class="scroll" style="text-align:center;"></div>
    </div>

$(document).ready(function() {
    GridDemo.Home.GridDemo.setupGrid($("#grid"), $("#pager"), $("#search"));
});

GridDemo.Home.GridDemo = {
    setupGrid: function(grid, pager, search) {
        grid.jqGrid({
        colNames: ['Int', 'String', 'Date'],
            colModel: [
                        { name: 'IntProperty', index: 'IntProperty' },
                        { name: 'StringProperty', index: 'StringProperty' },
                        { name: 'DateProperty', index: 'DateProperty' },
                      ],
            pager: pager,
            sortname: 'IntProperty',
            rowNum: 20,
            rowList: [10, 20, 50],
            sortorder: "asc",
            url: "GetGridData",
            altClass: 'altRow',
            altRows: true,
            gridComplete: handleGridComplete
        }).navGrid(pager, { edit: false, add: false, del: false, search: false });       
        search.filterGrid("#" + grid.attr("id"), {
            gridModel: false,
            filterModel: [{
                label: 'Search',
                name: 'search',
                stype: 'text'
            }]
        });
    }
};

function handleGridComplete()
{
    var recs = parseInt($("#grid").getGridParam("records"),10);
    if (recs = 0)
    {  
        $("gridwrapper").hide();
        alert("No records returned!");
    }
    else
    {  
        $("gridwrapper").hide();
        //alert("Records returned.");
    }
   
}

altClass: 'altRow'

altRows: true

are both in the javascript setup.

You don't only have to add the CSS I gave you, but in your grid config you have to add this as well:

altClass: 'altRow',

altRows: true