SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Guru
    Join Date
    Oct 2011
    Posts
    658
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    add css code inside while loop <tr>

    hi...

    I have query to display data and I use while loop.

    here is my code:
    Code:
    echo "<table id='kanban_list'>";
    echo "<tr>
            <th><label>Display Details:</label><input  onclick='showDetails(this);' id='chkDetail'   type='checkbox' checked='checked' value='wip'/></th>
            <th> PCODE </th>
            <th> LOT CODE </th>
            <th> CHEMICAL WEIGHING </th>
            <th> COMPOUNDING </th>
            <th> EXTRUSION </th>
            <th> FORMING </th>
            <th> DEFLASHING </th>
            <th> KANBAN </th>
            <th> VIRTUAL </th>
            <th> TOTAL </th>
            <!--<th> MIN LOT </th>-->
         </tr>";  
    $sql = "SELECT DISTINCT kd.PCODE, kc.count_wip_chemical_weighing, kc.count_wip_compounding, kc.count_wip_extrusion, 
    kc.count_wip_forming, kc.count_wip_deflashing, kc.kanban, kc.virtual, kc.total FROM kanban_checker kc JOIN kanban_data kd ON kc.PCODE = kd.PCODE
    ORDER BY kc.PCODE";
    $result = mysql_query($sql, $con); 
    while($row = mysql_fetch_assoc($result)){            
        echo "<tr>
            <td>Total Lot ID (Lot)</td>
            <td>&nbsp;$row[PCODE]</td>  
            <td>&nbsp;</td>
            <td>&nbsp;$row[count_wip_chemical_weighing]</td>                                          
            <td>&nbsp;$row[count_wip_compounding]</td>
            <td>&nbsp;$row[count_wip_extrusion]</td>
            <td>&nbsp;$row[count_wip_forming]</td>
            <td>&nbsp;$row[count_wip_deflashing]</td>
            <td>&nbsp;$row[kanban]</td>
            <td>&nbsp;$row[virtual]</td>
            <td>&nbsp;$row[total]</td>
           <!-- <td>&nbsp;$row[min_lot]</td>  -->
            </tr>";
    }
    
    $sql = "SELECT DISTINCT kd.PCODE, kdc.count_doz_chemical_weighing, kdc.count_doz_compounding, kdc.count_doz_extrusion, 
    kdc.count_doz_forming, kdc.count_doz_deflashing, kdc.kanban_doz, kdc.virtual_doz, kdc.total_doz FROM kanban_checker_doz kdc JOIN kanban_data kd ON kdc.PCODE = kd.PCODE
    WHERE kd.PCODE = '$row[PCODE]'
    ORDER BY kdc.PCODE";
    $result_qty = mysql_query($sql, $con);
    
    while ($row_doz = mysql_fetch_assoc($result_qty)){
         echo "<tr>
            <td>Total Qty (Doz)</td>
            <!--<td>&nbsp;</td>  -->
            <td>&nbsp;$row_doz[PCODE]</td> 
            <td>&nbsp;</td>
            <td>&nbsp;$row_doz[count_doz_chemical_weighing]</td>                                          
            <td>&nbsp;$row_doz[count_doz_compounding]</td>
            <td>&nbsp;$row_doz[count_doz_extrusion]</td>
            <td>&nbsp;$row_doz[count_doz_forming]</td>
            <td>&nbsp;$row_doz[count_doz_deflashing]</td>
            <td>&nbsp;$row_doz[kanban_doz]</td>
            <td>&nbsp;$row_doz[virtual_doz]</td>
            <td>&nbsp;$row_doz[total_doz]</td>
           <!-- <td>&nbsp;$row[min_lot]</td>  -->
            </tr>";   
    }
    echo "</table>";
    sample data:

    Display Details---Compound---Chemical Weighing-----etc...
    ---------------------P28------------1.00----------------------------
    ---------------------P28------------250.00------------------------
    ---------------------P30------------2.00--------------------------
    ---------------------P30------------520.00---------------------
    ---------------------P32------------1.00----------------------------

    I need to add alternate background color per compound.
    for example:

    P28 green
    P30 yellow
    P32 green
    P33 yellow
    and so on.

    Any help is highly appreciated.

    Thank you

    ---------------------P32------------520.00-----------------------
    ---------------------P33------------4.00----------------------------
    ---------------------P33------------1000.00---------------------

  2. #2
    SitePoint Evangelist
    Join Date
    Apr 2009
    Location
    South Carolina
    Posts
    458
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Have you tried setting a class and using CSS?

    Just adding a class to your code in this spot may do what you want.
    PHP Code:
    while ($row_doz mysql_fetch_assoc($result_qty)){
         echo 
    "<tr class="alternate">
            <td>Total Qty (Doz)</td> 
    then set your CSS to read something like:

    .alternate tr:nth-child(even) {
    background-color: #ffff00;
    }
    .alternate tr:nth-child(odd) {
    background-color: #00ff00;
    }
    Each day is a learning experience.

  3. #3
    SitePoint Enthusiast
    Join Date
    Sep 2010
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I thought I'd add this, for future reference (though as far as I'm aware it's not supported on IE8 or lower or on Opera at the minute), a method that doesn't require any extra classes or code. You just add this to your CSS:

    Code:
    tr:nth-child(even) {
      background-color: #ABCDEF;
    }
    You can replace even with odd if you wish to start on the first row instead of second. We'll hopefully see more of this in the future

  4. #4
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    1) TR is not actually supposed to accept background-color since it's a non-render element; so you want to target it's children, not the TR.

    2) if you're going to use nth-child, target off the parent table's ID instead of wasting time on extra classes.

    3) though as pointed out, nth-child doesn't exist on IE8/lower, so an alternating class on the TR targeting the TD/TH are your best bet.

    Zeroing a counter first, then going:

    Code:
    $counter=0;
    while ($row_doz = mysql_fetch_assoc($result_qty)) { 
      echo '<tr',( ++$counter%2==0 ? '' : ' class="even"' ),'> 
        <td>Total Qty (Doz)</td>
    Will put the class "even" on every other TR...

    Code:
    #kanban_list td {
      background:green;
    }
    
    #kanban_list .even td {
      background:yellow;
    }
    ...and that would work all the way back to IE 5.0

    Side Note: get your column headings into THEAD, your 'row upon row' of TD into TBODY, and get SCOPE on them.... and your first TD appears to be a row heading, so those should probably be TH as well... and of course there's the slow double quotes,parsing overhead, and non-breaking spaces / regular spaces doing padding's job...

  5. #5
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    Just to illustrate what I meant above about the TH, TBODY, THEAD and SCOPE...

    Code:
    echo '
    	<table id="kanban_list">
    		<thead>
    			<tr>
    				<td>
    					<label>Display Details:</label>
    					<input
    						onclick="showDetails(this);"
    						id="chkDetail"
    						type="checkbox"
    						checked="checked"
    						value="wip"
    					/>
    				</td>
    				<th scope="col">PCODE</th>
    				<th scope="col">LOT CODE</th>
    				<th scope="col">CHEMICAL WEIGHING</th>
    				<th scope="col">COMPOUNDING</th>
    				<th scope="col">EXTRUSION</th>
    				<th scope="col">FORMING</th>
    				<th scope="col">DEFLASHING</th>
    				<th scope="col">KANBAN</th>
    				<th scope="col">VIRTUAL</th>
    				<th scope="col">TOTAL</th>
    				<!--<th scope="col">MIN LOT</th>-->
    			</tr>
    		</thead><tbody>';
    
    $sql="SELECT DISTINCT kd.PCODE, kc.count_wip_chemical_weighing, kc.count_wip_compounding, kc.count_wip_extrusion, kc.count_wip_forming, kc.count_wip_deflashing, kc.kanban, kc.virtual, kc.total FROM kanban_checker kc JOIN kanban_data kd ON kc.PCODE=kd.PCODE
    ORDER BY kc.PCODE";
    
    $result=mysql_query($sql, $con);
    $counter=0;
    while ($row=mysql_fetch_assoc($result)){
    	echo '
    		<tr',(++$counter%2==0 ? '' : ' class="even"'),'>
    			<th scope="row">Total Lot ID (Lot)</th>
    			<td>',$row[PCODE],'</td>
    			<td></td>
    			<td>',$row[count_wip_chemical_weighing],'</td>
    			<td>',$row[count_wip_compounding],'</td>
    			<td>',$row[count_wip_extrusion],'</td>
    			<td>',$row[count_wip_forming],'</td>
    			<td>',$row[count_wip_deflashing],'</td>
    			<td>',$row[kanban],'</td>
    			<td>',$row[virtual],'</td>
    			<td>',$row[total],'</td>
    			<!-- <td>',$row[min_lot],'</td>	-->
    		</tr>';
    }
    
    $sql="SELECT DISTINCT kd.PCODE, kdc.count_doz_chemical_weighing, kdc.count_doz_compounding, kdc.count_doz_extrusion, kdc.count_doz_forming, kdc.count_doz_deflashing, kdc.kanban_doz, kdc.virtual_doz, kdc.total_doz FROM kanban_checker_doz kdc JOIN kanban_data kd ON kdc.PCODE=kd.PCODE
    WHERE kd.PCODE='$row[PCODE]'
    ORDER BY kdc.PCODE";
    
    $result_qty=mysql_query($sql, $con);
    while ($row_doz=mysql_fetch_assoc($result_qty)){
    	echo '
    		<tr',(++$counter%2==0 ? '' : ' class="even"'),'>
    			<th scope="row">Total Qty (Doz)</th>
    			<td>',$row_doz[PCODE],'</td>
    			<td></td>
    			<td>',$row_doz[count_doz_chemical_weighing],'</td>
    			<td>',$row_doz[count_doz_compounding],'</td>
    			<td>',$row_doz[count_doz_extrusion],'</td>
    			<td>',$row_doz[count_doz_forming],'</td>
    			<td>',$row_doz[count_doz_deflashing],'</td>
    			<td>',$row_doz[kanban_doz],'</td>
    			<td>',$row_doz[virtual_doz],'</td>
    			<td>',$row_doz[total_doz],'</td>
    			<!-- <td>',$row[min_lot],'</td>	-->
    		</tr>';
    }
    
    echo '
    	</tbody>
    </table>';
    I also changed the first column in THEAD to a td -- that doesn't feel like a heading for that column.

  6. #6
    SitePoint Guru
    Join Date
    Oct 2011
    Posts
    658
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I already resolve my code using this:
    Code:
    while ($row_doz = mysql_fetch_assoc($result_qty)){ 
         if($row_doz[PCODE] == 'P28') {
            $css_class = 'blue-css-class-name';
        }
        elseif($row_doz[PCODE] == 'P30') {
            $css_class = 'green-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P32') {
            $css_class = 'blue-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P33') {
            $css_class = 'green-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P35') {
            $css_class = 'blue-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P35M') {
            $css_class = 'green-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P35W') {
            $css_class = 'blue-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P38') {
            $css_class = 'green-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P41') {
            $css_class = 'blue-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P42') {
            $css_class = 'green-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P43') {
            $css_class = 'blue-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P46') {
            $css_class = 'green-css-class-name';
        }
        elseif ($row_doz[PCODE] == 'P47') {
            $css_class = 'blue-css-class-name';
        }
        else{
            $css_class = '';
        }
        
        echo "<tr class='".$css_class."'>
            <td>Total Qty (Doz)</td>
            <!--<td>&nbsp;</td>  -->
            <td>&nbsp;$row_doz[PCODE]</td> 
            <td>&nbsp;</td>
           <!-- <td>$row[LOT_CODE]</td>   -->
            <td>&nbsp;$row_doz[count_doz_chemical_weighing]</td>                                          
            <td>&nbsp;$row_doz[count_doz_compounding]</td>
            <td>&nbsp;$row_doz[count_doz_extrusion]</td>
            <td>&nbsp;$row_doz[count_doz_forming]</td>
            <td>&nbsp;$row_doz[count_doz_deflashing]</td>
            <td>&nbsp;$row_doz[kanban_doz]</td>
            <td>&nbsp;$row_doz[virtual_doz]</td>
            <td>&nbsp;$row_doz[total_doz]</td>
           <!-- <td>&nbsp;$row[min_lot]</td>  -->
            </tr>"; 
             
    }

    Thank you

  7. #7
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2006
    Location
    Augusta, Georgia, United States
    Posts
    4,182
    Mentioned
    16 Post(s)
    Tagged
    4 Thread(s)
    You shouldn't be using presentational classes. Instead use class names that convey the context of each separate case. In this case the pcode with a static prefix is probably more appropriate.
    The only code I hate more than my own is everyone else's.

  8. #8
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    Much less the flat out inefficiency of that mass of if/else/if/else/if/else -- that's Switch/case's job -- or maybe an array lookup.

    Oh, and it's also not cool to be skipping using quotes around your indexes, especially since in some future version of PHP they are going to drop that! (says so on PHP.net in the arrays section)

    Switch/case -- much simpler:
    Code:
    switch ($row_doz['PCODE']) {
    
    	case 'P28':
    	case 'P32':
    	case 'P35':
    	case 'P35W':
    	case 'P41':
    	case 'P43':
    	case 'P47':
    		$css_extra=' class="odd"';
    	break;
    	
    	case 'P30':
    	case 'P33':
    	case 'P35M':
    	case 'P38':
    	case 'P42':
    	case 'P46':
    		$css_extra=' class="even"';
    	break;
    	
    	default:$css_extra='';
    }
    since you had three states I put the class= in there so when an unrecognized value comes along, you aren't wasting time saying it.

    Or with an array lookup:

    Code:
    $colorMatches=array(
    	'P28' => 'odd',
    	'P35' => 'odd',
    	'P35W' => 'odd',
    	'P41' => 'odd',
    	'P43' => 'odd',
    	'P47' => 'odd',
    	'P30' => 'even',
    	'P33' => 'even',
    	'P35M' => 'even',
    	'P38' => 'even',
    	'P42' => 'even',
    	'P46' => 'even'
    );
    	
    $class=(
    	isset($colorMatches[$row_doz['PCODE']]) ?
    	$colorMatches[$row_doz['PCODE']] :
    	''
    );
    Though targeting them specifically doesn't guarantee alternating rows if any of those are MISSING... or if you decide to add more codes later -- which is why I'd advocate using a counter modulo 2 as I showed, or perhaps a self negating boolean.

    The latter of those being as simple as doing $odd=false; then for each TR just:

    Code:
    echo '<tr class="',(
      ($odd=!$odd) ? 'odd' : 'even'
    ),'">';
    though again, that's alternating the colors automatically, not assigning them directly to just specific values.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •