php - How to show correct td of table tags in wp_query loop

admin管理员组

文章数量:1134248

I Have this loop:

   <?php
      $post_ids_fetched = array(347, 258);
      $editor = new WP_Query(
     array(
       'posts_per_page'=>4,
       'post_type'=> 'earth',
       'post__in' => $post_ids_fetched,
       'orderby' => 'post__in',
       'post_status' => 'publish'
      )
     );
     if( $editor->have_posts() ) {
         while( $editor->have_posts() ) {
             $editor->the_post();
      ?>
      <table >
          <tbody>
            <tr>
                <td class="am-t-lable">state</td>
                <td class="am-t-value"><?php the_field('state'); ?></td>
            </tr>
            <tr>
              <td class="am-t-lable">city</td>
              <td class="am-t-value"><?php the_field('city'); ?></td>
            </tr>
          </tbody>
      </table>
    <?php }} ?>

How can the output of the loop be the following?

   <table>
      <tbody>
        <tr>
            <td class="am-t-lable">state</td>
            <td class="am-t-value">state name 1</td>
            <td class="am-t-value">state name 2</td>
            <td class="am-t-value">state name 3</td>
            <td class="am-t-value">state name 4</td>
        </tr>
        <tr>
          <td class="am-t-lable">city</td>
            <td class="am-t-value">city name 1</td>
            <td class="am-t-value">city name 2</td>
            <td class="am-t-value">city name 3</td>
            <td class="am-t-value">city name 4</td>
        </tr>
      </tbody>
  </table>

I have 40 ACF fields. Is it very wrong to put 40 separate loop inside each <tr>?

<?php
 $post_ids_fetched = array(347, 258);
 $editor = new WP_Query(
  array(
  'posts_per_page'=>4,
  'post_type'=> 'earth',
  'post__in' => $post_ids_fetched,
  'orderby' => 'post__in',
  'post_status' => 'publish'
   )
   );
  ?>
 <table >
     <tbody>
       <tr>
           <td class="am-t-lable">state</td>
           <?php
             if( $editor->have_posts() ) {
                 while( $editor->have_posts() ) {
                     $editor->the_post();
              ?>
                <td class="am-t-value"><?php the_field('state'); ?></td>
              <?php }} ?>
       </tr>
       <tr>
           <td class="am-t-lable">state</td>
           <?php
             if( $editor->have_posts() ) {
                 while( $editor->have_posts() ) {
                     $editor->the_post();
              ?>
                <td class="am-t-value"><?php the_field('city'); ?></td>
              <?php }} ?>
       </tr>
       
       ....
       
     </tbody>
 </table>

I Have this loop:

   <?php
      $post_ids_fetched = array(347, 258);
      $editor = new WP_Query(
     array(
       'posts_per_page'=>4,
       'post_type'=> 'earth',
       'post__in' => $post_ids_fetched,
       'orderby' => 'post__in',
       'post_status' => 'publish'
      )
     );
     if( $editor->have_posts() ) {
         while( $editor->have_posts() ) {
             $editor->the_post();
      ?>
      <table >
          <tbody>
            <tr>
                <td class="am-t-lable">state</td>
                <td class="am-t-value"><?php the_field('state'); ?></td>
            </tr>
            <tr>
              <td class="am-t-lable">city</td>
              <td class="am-t-value"><?php the_field('city'); ?></td>
            </tr>
          </tbody>
      </table>
    <?php }} ?>

How can the output of the loop be the following?

   <table>
      <tbody>
        <tr>
            <td class="am-t-lable">state</td>
            <td class="am-t-value">state name 1</td>
            <td class="am-t-value">state name 2</td>
            <td class="am-t-value">state name 3</td>
            <td class="am-t-value">state name 4</td>
        </tr>
        <tr>
          <td class="am-t-lable">city</td>
            <td class="am-t-value">city name 1</td>
            <td class="am-t-value">city name 2</td>
            <td class="am-t-value">city name 3</td>
            <td class="am-t-value">city name 4</td>
        </tr>
      </tbody>
  </table>

I have 40 ACF fields. Is it very wrong to put 40 separate loop inside each <tr>?

<?php
 $post_ids_fetched = array(347, 258);
 $editor = new WP_Query(
  array(
  'posts_per_page'=>4,
  'post_type'=> 'earth',
  'post__in' => $post_ids_fetched,
  'orderby' => 'post__in',
  'post_status' => 'publish'
   )
   );
  ?>
 <table >
     <tbody>
       <tr>
           <td class="am-t-lable">state</td>
           <?php
             if( $editor->have_posts() ) {
                 while( $editor->have_posts() ) {
                     $editor->the_post();
              ?>
                <td class="am-t-value"><?php the_field('state'); ?></td>
              <?php }} ?>
       </tr>
       <tr>
           <td class="am-t-lable">state</td>
           <?php
             if( $editor->have_posts() ) {
                 while( $editor->have_posts() ) {
                     $editor->the_post();
              ?>
                <td class="am-t-value"><?php the_field('city'); ?></td>
              <?php }} ?>
       </tr>
       
       ....
       
     </tbody>
 </table>

• php
• wp-query
• loop
• html

Share Improve this question edited Aug 1, 2023 at 12:48 och asked Aug 1, 2023 at 11:52 ochoch 3911 silver badge88 bronze badges 4

• doing this will require you to store teh data in variables as you go through the loop rather than outputting the data directly. Then you'd need to do additional loops after the query loop to take what those variables contain and output them. This will also involve swapping out the_field for the getter version in the ACF API. Importantly though, none of this is specific to WordPress or even PHP/web development it's generic programming knowledge. 1 loop to gather the data, a second to display the states, a third to display the cities – Tom J Nowell ♦ Commented Aug 1, 2023 at 12:36
• TNX @TomJNowell I have 40 ACF fields. Is it very wrong to put 40 separate loop inside each <tr>? – och Commented Aug 1, 2023 at 12:42
• it needn't be 40 separate loops, though if you have 40 separate rows that is one way of doing it. You could store a single array of objects. You could also store the data in the same structure as the table so that you only need 2 nested loops to generate the entire table. There are lots of ways of doing it, some with pros and cons, but none of them are WordPress specific. There are also potentially non-PHP options since what you're trying to do if we were to use spreadsheet terminology is to transpose the table, swap the rows and columns around. Note the loops would not be inside thetr – Tom J Nowell ♦ Commented Aug 1, 2023 at 13:20
• Also note that by rearranging your table like that it's not as accessible. This is because State and City being on the left means they can no longer be put inside a table header, reducing the accessibility of the table, and also reducing your styling options as you can no longer put the table heading and footer cells inside a <thead> element. I wonder if WPSE is the best stack to ask this on given that it isn't really a WordPress specific question but a general PHP/programming question – Tom J Nowell ♦ Commented Aug 1, 2023 at 13:23

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 1

This cannot be done inside the tr tags, you need to separate this out into two stages. First collect the data ( without displaying any HTML ), then display that data.

For example:

$editor = new WP_Query( [
    'posts_per_page' => 20
] );

// each item in this array will be a post/an array of all
// the fields in a post
$table = [];

// and these are the items/rows we want to display
$labels = [ 'first', 'second', 'third' ];

// First fill $table with data
if ( $editor->have_posts() ) {
    while( $editor->have_posts() ) {
        $editor->the_post();
        $table[] = [
            'first' => get_post_meta( get_the_ID(), 'firstmeta', true ),
            'second' => get_post_meta( get_the_ID(), 'second', true ),
            'third' => get_post_meta( get_the_ID(), 'third..etc', true ),
        ];
    }
}

// Second, display the data we just collected
?>
<table >
    <tbody>
        <?php
        foreach( $labels as $label ) {
            ?>
            <tr>
                <th class="am-t-lable"><?php echo esc_html( $label ); ?></th>
                <?php
                foreach( $table as $post ) {
                    ?>
                    <td class="am-t-value"><?php echo esc_html( $post[ $label ] ); ?></td>
                    <?php
                }
                ?>
            </tr>
        }
        ?>
    </tbody>
</table>

Importantly, this is not the only way to do something like this, there are lots of alternatives, some that don't involve loops at all but use functions such as array_map etc.

The most important part, is that you don't have to fetch the data and display it at the same time and mix that code together. In the above example you could take each step and make them their own function completely separate! Separation of concerns is a good skill and best practice in programming.

本文标签： phpHow to show correct td of table tags in wpquery loop