Member Avatar for bhavna_816

How to change the color of selected row of an HTML table without using CSS or Javascript?

  • 4 Contributors
  • 4 Replies
  • 218 Views
  • 4 Years Discussion Span
  • Latest Post Latest Post by huteram

Dani AI

Generated

Short answer: a browser cannot change a row’s color interactively without CSS or JavaScript. The only pure‑HTML options are (a) set a static color with presentational attributes (deprecated in modern HTML) or (b) perform a full page round‑trip and have the server re‑render the table with the chosen row painted. already pointed to using presentational attributes; ’s onmouseover uses JavaScript, which doesn’t meet the “no JavaScript” requirement; ’s question about using HTML is correct in that HTML can define a color — but not change it after the page is loaded without a reload.

Practical, maintainable approach without client‑side JS or CSS: make each row a selectable link or form control that submits the row id to the server. The server then returns the page with the selected row emitted with a background attribute so it appears highlighted. This guarantees the selection visually changes without any client scripting. Important: the bgcolor attribute is deprecated in HTML5, so this is strictly a compatibility workaround rather than modern best practice.

Example (server renders selected row):

<?php
$rows = [
  ['id'=>1,'name'=>'Alice'],
  ['id'=>2,'name'=>'Bob'],
  ['id'=>3,'name'=>'Carol'],
];
$sel = isset($_GET['sel']) ? intval($_GET['sel']) : 0;
echo "<table border=\"1\">\n";
foreach ($rows as $r) {
  $bg = ($r['id'] === $sel) ? ' bgcolor="#ffeb99"' : '';
  echo "<tr$bg>\n";
  echo "<td><a href=\"?sel={$r['id']}\">select</a></td>\n";
  echo "<td>" . htmlspecialchars($r['name'], ENT_QUOTES) . "</td>\n";
  echo "</tr>\n";
}
echo "</table>\n";
?>

Notes and cautions: this approach requires a page reload on each selection; it relies on deprecated attributes so prefer server‑rendered classes/CSS for long‑term projects. Sanitize any input used to pick the row to avoid XSS. If client responsiveness is required, add unobtrusive JavaScript later as progressive enhancement.

Recommended Answers

All 4 Replies

Member Avatar for Member #46692

If it's html why can't u just use html to change the colour?

Member Avatar for madan_sh2009

<table border="1">
<tr>
<td bgcolor="red">rowname first,second </td>
<td> name</td>
</tr>

Member Avatar for madan_sh2009

<table border="1">
<tr>
<td bgcolor="red">rowname first,second </td>
<td> name</td>
</tr>

Member Avatar for huteram

I think that this is answer for your quastion:
<table border="1">
<tr onmouseover="style.backgroundColor = '#cdcdcd';" onmouseout="style.backgroundColor = '#ededed';">
<td>rowname first,second </td>
<td> name</td>
</tr>

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.