How to create alternate row color?

Stiebel Eltron
Stiebel Eltron used Ask the Experts™
on
<body bgproperties="fixed" bgcolor="#000000" onLoad="javascript:startmenu()">

<%
	Dim myConnection
	Dim rsUsers
	Dim connectString
	Dim sqlString
	Dim requestName

	connectString = "DRIVER={MySQL ODBC 3.51 Driver}; SERVER=DBSERVER; PORT=3306; DATABASE=DB; USER=DBUSER; PASSWORD=DBPW; OPTION=0;"

	Set myConnection = Server.CreateObject("ADODB.Connection")
	Set rsUsers = Server.CreateObject("ADODB.Recordset")

	myConnection.Open connectString

	requestName=Request.Form("FName")

	sqlString = "Select * From users ORDER BY ID ASC"
	
	Set rsUsers = myConnection.Execute(sqlString)

%>


<table width="760" border="0" cellspacing="3" cellpadding="1">
  <tr>
    <td width="134"><img src="../IMG/logo_res.jpg" alt="STIEBEL ELTRON" /></td>
    <td width="620" valign="top" bgcolor="#666666"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="548" height="197">
      <param name="movie" value="homeintro20.swf" />
      <param name="quality" value="high" />
      <param name="wmode" value="opaque" />
      <embed src="homeintro20.swf" quality="high" wmode="opaque" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="548" height="197"></embed>
    </object></td>
    <td width="134" bgcolor="#FFFFFF"><img src="../IMG/white_square.png" alt="ASIA" border="0" align="top"/></td>
  </tr>
  <tr>
    <td bgcolor="#666666">&nbsp;</td>
    <td align="right" bgcolor="#999999"><font face="Verdana, Geneva, sans-serif" color="#ffffff">
    <%
   '// If user is logged in show name and logout link
   If Session("loggedin") = true Then
      Response.Write "Welcome: " & Session("FName")
      Response.Write "<br /><a href=""../asia2/login/logout.asp"">Logout</a>"
   Else
      Response.Write "<a href=""../ste-iphoto-login2.asp"" title=""CLICK TO LOGIN"">REGISTERED USERS</a>"
   End If
	%>&nbsp;
	</td>
    <td bgcolor="#666666" align="center">&nbsp;</td>
  </tr>
  <tr>
    <td bgcolor="#999999">&nbsp;</td>
    <td align="left" bordercolor="#999999" bgcolor="#000000"><img src="../IMG/admin_panel.jpg" width="548" /><br></td>
    <td bgcolor="#999999" valign="top" align="center">&nbsp;
		
    </td>
  </tr>
  <tr>
    <td colspan="3" bgcolor="#FFFFFF">
    <table width="100%" border="1" cellpadding="0" cellspacing="1" bordercolor="#999999">
        	<tr>
            	<td class="td1" bgcolor="#CCCCCC">ID</td>
                <td class="td1" bgcolor="#CCCCCC">ID</td>
               	<td class="td1" bgcolor="#CCCCCC">FIRST NAME</td>
            	<td class="td1" bgcolor="#CCCCCC">LAST NAME</td>
                <td class="td1" bgcolor="#CCCCCC">EMAIL</td>
                <td class="td1" bgcolor="#CCCCCC">PASSWORD</td>
                <td class="td1" bgcolor="#CCCCCC">COUNTRY</td>
                <td class="td1" bgcolor="#CCCCCC">TELEPHONE</td>
                <td class="td1" bgcolor="#CCCCCC">MOBILE</td>
                <td class="td1" bgcolor="#CCCCCC">COMPANY</td>
                <td class="td1" bgcolor="#CCCCCC">ADDRESS</td>
                <td class="td1" bgcolor="#CCCCCC">STATUS</td>
            </tr>
            <!--Get DATA-->      
		<%
		do while not rsUsers.EOF
		%>
        	<tr>
            
            	<td class="td2"><a href="javascript:myPopup('edit_user.asp?USERID=<%=rsUsers("ID")%>', 'EDITUSER','960','600','10','300')"><img src="../IMG/edit_icon_small.png" alt="EDIT USER" border="0"/></a></td>
                <td class="td2"><%=rsUsers("ID")%></td>
               	<td class="td2"><%=rsUsers("FName")%></td>
            	<td class="td2"><%=rsUsers("LName")%></td>
                <td class="td2"><%=rsUsers("Email")%></td>
                <td class="td2"><%=rsUsers("Password")%></td>
                <td class="td2"><%=rsUsers("Country")%></td>
                <td class="td2"><%=rsUsers("Telephone")%></td>
                <td class="td2"><%=rsUsers("Mobile")%></td>
                <td class="td2"><%=rsUsers("Company")%></td>
                <td class="td2"><%=rsUsers("Address")%></td>
                <td class="td2"><%=rsUsers("Status")%></td>
            </tr>
		<% rsUsers.MoveNext %>
<%loop %><!--Next Row-->
        </table>
    </td>

Open in new window


Dear EE experts,

We would like to ask for tech support on how to create alternating row color.
We tried some stuff from the web, but we failed to create one...
Here's the link of the site that we would like to have alternating row color:
http://www.cssasia.info/beta/login/admin_panel.asp

Thank you...
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
You can use CSS3. Find below URL for more details.

http://davidwalsh.name/css-tables-css3-alternate-row-colors
Kiran Paul VJComputer Engineer
Commented:
Try something like this. Syntax may be incorrect, done ASP before 7 years

<%
        count = 0
            do while not rsUsers.EOF

            %>
              <tr <% if count mod 2 = 0 Then %>style="background-color:#fc0;"<% End if %>>
           
                  <td class="td2"><a href="javascript:myPopup('edit_user.asp?USERID=<%=rsUsers("ID")%>', 'EDITUSER','960','600','10','300')"><img src="../IMG/edit_icon_small.png" alt="EDIT USER" border="0"/></a></td>
                <td class="td2"><%=rsUsers("ID")%></td>
                     <td class="td2"><%=rsUsers("FName")%></td>
                  <td class="td2"><%=rsUsers("LName")%></td>
                <td class="td2"><%=rsUsers("Email")%></td>
                <td class="td2"><%=rsUsers("Password")%></td>
                <td class="td2"><%=rsUsers("Country")%></td>
                <td class="td2"><%=rsUsers("Telephone")%></td>
                <td class="td2"><%=rsUsers("Mobile")%></td>
                <td class="td2"><%=rsUsers("Company")%></td>
                <td class="td2"><%=rsUsers("Address")%></td>
                <td class="td2"><%=rsUsers("Status")%></td>
            </tr>
            <%
        count = count + 1
        rsUsers.MoveNext %>
<%loop %>
Success in ‘20 With a Profitable Pricing Strategy

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

Developer & EE Moderator
Fellow 2018
Most Valuable Expert 2013
Commented:
You can also do it using serverside script and will work in all browsers.  This is placing the color as a background for the row but you can just as easily change the background of the class as well.

             
           <!--Get DATA-->      
            <%
                 dim rCount,bgColor
                 rCount=0
            do while not rsUsers.EOF
                 rCount=rCount+1
                 if rCount mod 2 = 0 then
                       bgColor="#FF0000"
                             else
                       bgColor="#3300FF"
            end if
                  %>
              <tr bgcolor=<%=bgColor%> >
           
                  <td class="td2"><a href="javascript:myPopup('edit_user.asp?USERID=<%=rsUsers("ID")%>', 'EDITUSER','960','600','10','300')"><img src="../IMG/edit_icon_small.png" alt="EDIT USER" border="0"/></a></td>
                <td class="td2"><%=rsUsers("ID")%></td>
                     <td class="td2"><%=rsUsers("FName")%></td>
                  <td class="td2"><%=rsUsers("LName")%></td>
                <td class="td2"><%=rsUsers("Email")%></td>
                <td class="td2"><%=rsUsers("Password")%></td>
                <td class="td2"><%=rsUsers("Country")%></td>
                <td class="td2"><%=rsUsers("Telephone")%></td>
                <td class="td2"><%=rsUsers("Mobile")%></td>
                <td class="td2"><%=rsUsers("Company")%></td>
                <td class="td2"><%=rsUsers("Address")%></td>
                <td class="td2"><%=rsUsers("Status")%></td>
            </tr>
            <% rsUsers.MoveNext %>
<%loop %><!--Next Row-->
        </table>

Author

Commented:
Both are best solution...

Excellent!
Thank you!
Kiran Paul VJComputer Engineer

Commented:
Glad to know it helped.

Kiranvj

Author

Commented:
@Kiranvj, thanks for the support :)
Scott FellDeveloper & EE Moderator
Fellow 2018
Most Valuable Expert 2013

Commented:
Just a note if you are going to use this for any html5 stuff, you will want to use a css class instead of the row background color if you care about validation.
Kiran Paul VJComputer Engineer

Commented:
Just a addon to padas, if you are using html5, defenitly css3 will be working in that browser. So you can try CSS3 even/odd feature. As of now it will not support in all browsers, hence not recommended.

http://dev.opera.com/articles/view/zebra-striping-tables-with-css3/

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial