StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>If you want to have each button show a different table, I would use ids to create a relationship between the button and the table. I presume that you're using an auto-incrementing primary key in your table; if not, you could just put a counter in the loop and use that as the id.</p> <p>A lot of the code for outputting valid tables is left out below. </p> <pre><code><?php while($row3 = mysql_fetch_array($sql3)){ //output your normal table rows //presuming a numeric primary key to use as id echo "<td><button id='showr_" . $row3['primaryKey'] . "' class='showr'>Show Details</button></td>"; } ?> <?php //reset mysql data set so we can loop through it again to output the second tables mysql_data_seek($sql3, 0); while($row3 = mysql_fetch_array($sql3)){ //output hidden table echo "<table style='display: none' class='table2' id='table2_" . $row3['primaryKey'] . "'>"; //output rest of rows here... echo "</table>"; ?> </code></pre> <p>The Javascript will see that a button is clicked, grab the id for that button, and show the relevant table while hiding any table that might currently be showing.</p> <pre><code><script type='text/javascript'> $(document).ready(function() { $('.showr').click(function(){ //get id by splitting on the underscore within the 'id' attribute //$(this) refers to the button that has been clicked var id = $(this).attr('id').split('_')[1]; //hide all table2's and then show the one we want $('.table2').hide(); $('#Table2_' + id).show(); }); }); </script> </code></pre> <p></p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload