KWwillodean
New Member
I am making a table in which PHP is used in \[code\]<td>\[/code\] tags. This contains a list of products and their prices. On the top of the table, I have inserted two buttons, one for arranging data in ascending order of price, and the other one is for descending order. By default, the data is in ascending order. When I click on the descending order button, it works but with of the table data changes which is not required.Here is my CSS code:\[code\]a {text-decoration:none; color:#0000FF;}#hold .log { color:#0000FF; text-align:center; font-size:20px;}h2 {color:#0000FF;}#left { width:200px;border:1px;border-style:solid;margin:0 auto;margin-top:20px;text-align:center;border- color:#0000FF;float:left;}#left div {border:1px;border-style:solid;border-color:#0000FF;}#left div a {}.style table {border:1px;border-style:solid;border-color:#0000FF;}.style table tr td {border:1px;border-style:solid;border-color:#0000FF;color:#333;width:250px;}.style table tr td input,select,textarea {width:250px;height:30px;}\[/code\]Here is the code for the table:\[code\]<button onclick="as()">Ascending Order</button><button onclick="ds()">Descding Order</button><div class="style"><table><tr><td>Title</td> <td>Price</td></tr><th><h2 style="text-align:left;">Cameras</h2></th><tr> <?php $i=1; $qry_cam=mysql_query("SELECT* FROM camera ORDER BY camera.price ASC",$con); while($row=mysql_fetch_array($qry_cam)) { echo "<tr id='cam_as'> <td>$i-$row[title]<br /></td> <td>$row[price]<br /></td> </tr>"; $i++; } ?></tr><tr> <?php $i=1; $qry_cam=mysql_query("SELECT* FROM camera ORDER BY camera.price DESC",$con); while($row=mysql_fetch_array($qry_cam)) { echo "<tr id='cam_ds' style='display:none;'> <td>$i-$row[title]<br /></td> <td>$row[price]<br /></td> </tr>"; $i++; } ?></tr></table></div><!-- style ends-->\[/code\]Finally, here is the script which is doing this all required work:\[code\]<script type="text/javascript"> function as() { $('#cam_as,#com_as,#cell_as').css('display','block'); $('#cam_ds,#com_ds,#cell_ds').css('display','none'); } function ds() { $('#cam_ds,#com_ds,#cell_ds').css('display','block'); $('#cam_as,#com_as,#cell_as').css('display','none'); }</script>\[/code\]I have tried but I am unable to find where I am going wrong.