I created a table that I am using as a draft board. There are users and then players they have to pick. I am wondering if a user has picked a player if there is anyway I can style that cell block in a different color style to show that block more significantly that it was picked. Then the empty blocks leave the normal styling.
I created a fiddle to show the table somewhat how it looks.
https://jsfiddle.net/zmggLd57/
So the cells that have names in them I was wondering if I could make them a different color.
<table class="draft_border_table">
<tr>
<th class="draft_table_number_th">RND</th>
<?php
// Output usernames as column headings
$userResults = mysqli_query($con, 'SELECT * FROM user_players ORDER BY `id`');
while ($userPlayer = mysqli_fetch_array($userResults)) {
$userPlayerStore[] = $userPlayer;
echo '<th class="draft_table_th"><div>' . $userPlayer['username'] . '</div></th>';
}
?>
</tr>
<?php
// Output each user's player 1-14 in each row
$totalPlayerNumbers = 14;
for ($playerNum = 1; $playerNum <= $totalPlayerNumbers; $playerNum++) {
echo '<tr><td><div class="draftBorder">' . $playerNum . '</div></td>';
foreach ($userPlayerStore as $userPlayer) {
echo '<td class="draft_table_td">' . $userPlayer['player' . $playerNum] . '</td>';
}
echo '</tr>';
}
?>
</table>
i hope, it will help you
$("td.draft_table_td").each(function(){
if($(this).text()!=""){
$(this).css("background-color","blue");
}
});
Add an extra css class for the filled in or blank table cells.
...
foreach ($userPlayerStore as $userPlayer) {
if (empty($userPlayer['player'.$playerNum])){
$extra_class = 'emptycell';
}else{
$extra_class = 'filledcell';
}
echo '<td class="draft_table_td '.$extra_class.'">' .
$userPlayer['player' . $playerNum] . '</td>';
}
then add the appropriate styling in your .css
td.draft_table_td.emptycell {
background: red;
}