Quark
Quark

Reputation: 59

Table appears below the footer, unable to determine where to place </table> in functions.php

I have created a shortcode and placed it in my functions.php file. I am querying MySQL database, after obtaining the results I loop through the array and finally display it as a table. I was able build the below using Difster and Elliot's answers to my question here. However, the table shows up below the footer

add_shortcode('wpse_233031_shortcode', function(){
   global $wpdb;
   $myrows = $wpdb->get_results("SELECT * FROM PNaphtha", ARRAY_A);
   echo "<table><tr><th>SrNo</th><th>Compound</th><th>Tc (K)</th><th>Pc (bar)</th></tr>";

ob_start();

foreach ( $myrows as $row) {
   echo "<tr><td>".$row['SrNo']."</td><td>".$row['Compound']."</td><td>". 
   $row['Tc (K)']."</td><td>".$row['Pc (bar)']."</td></tr>";
   }

return ob_get_clean(); 
});

I realize that I need to close the table tag but I am unable to determine where to place the </table>. If I use

foreach ( $myrows as $row) {
   echo "<tr><td>".$row['SrNo']."</td><td>".$row['Compound']."</td><td>". 
   $row['Tc (K)']."</td><td>".$row['Pc (bar)']."</td></tr>  </table>";
   }

The table closes after the first row is echoed and the rest of the data appears as text

enter image description here

I get syntax errors in my functions.php if I try to place it anywhere after the echo, if I save it anyway I get an HTTP ERROR 500 on my page. Can you please advise the appropriate way to close the table to avoid it from appearing below the footer. According to GautamJeyaraman's answer here I can force it to the bottom "For the main footer's css, add position:relative and bottom:0. It will always be fixed to the bottom." However, I also have the menu and a search bar that are getting disturbed due to the table's behavior and would prefer to fix the table itself.

Upvotes: 0

Views: 515

Answers (2)

Pheonix2105
Pheonix2105

Reputation: 1011

add_shortcode('wpse_233031_shortcode', function(){
   global $wpdb;
    //start table tag
    $outputHTML = '<table>';
    $myrows = $wpdb->get_results("SELECT * FROM PNaphtha", ARRAY_A);
    //add table row and table header
    $outputHTML += "<tr><th>SrNo</th><th>Compound</th><th>Tc (K)</th><th>Pc (bar)</th> 
    </tr>";

ob_start();

foreach ( $myrows as $row) {
    //add each row inside the forloop
   $outputHTML += "<tr><td>".$row['SrNo']."</td><td>".$row['Compound']."</td><td>". 
   $row['Tc (K)']."</td><td>".$row['Pc (bar)']."</td></tr>";
   }
$outputHTML += = '</table>'
    //end the table after the loop has done
return ob_get_clean(); 
});

Something like this perhaps?

Not sure how you're outputting the data but you can just echo the built string at the end, I haven't worked with wordpress in a while.

Upvotes: 1

Laurens
Laurens

Reputation: 2607

You are closing the table inside of the foreach loop. you have to close the table when your foreach loop is done (and all your rows are printed):

foreach ( $myrows as $row) {
    echo "<tr><td>".$row['SrNo']."</td><td>".$row['Compound']."</td><td>". 
    $row['Tc (K)']."</td><td>".$row['Pc (bar)']."</td></tr>";
}
echo "</table>";

Upvotes: 3

Related Questions