Bootstrap таблица удваивается / утраивается и т. Д. c строки - PullRequest
Новая
       5

Bootstrap таблица удваивается / утраивается и т. Д. c строки

0 голосов
/ 21 апреля 2020

У меня есть вопрос (я использую WordPress со своим собственным кодом). Перед реализацией таблицы bootstrap для сортировки моих данных она показала 3 строки информации, после реализации она показала 9, поэтому я попытался добавить еще одну запись, и она показала 16 (удваивается каждый раз). Что я должен изменить в своем коде, чтобы остановить умножение? Я получаю данные в таблицу из URL после использования фильтра (поиск из сообщений WordPress) 

    <div class="table-responsive">
            <table 
 id="table"
data-toggle="table"
  data-search="true"
  data-show-columns="true"
 class="table table-striped">
      <thead>
        <tr>
          <th  scope="col">Goods</th>
          <th  scope="col">Tent</th>
          <th   data-sortable="true" scope="col">Load/Unload</th>
          <th   scope="col">From/To</th>
        </tr>
      </thead>
                <div class="post clearfix">
            <?php
                    $args = array(
                        'post_type' => 'post',
                        'posts_per_page' => -1,
                        'meta_query' => array(
                            array(
                                'key' => 'tent',
                                'value' => $tent,
                                'compare' => 'LIKE'
                            ),

                            array(
                                'key' => 'laadimise_kp',
                                'value' => array($laadimise_kp, $mahalaadimine),
                                'compare' => 'BETWEEN',
                                'type' => 'DATE'
                            ),

                            array(
                                'key' => 'from',
                                'value' => $from,
                                'compare' => 'LIKE'
                            ),

                            array(
                                'key' => 'to',
                                'value' => $to,
                                'compare' => 'LIKE'
                            ),
                        )
                    );
                    $query = new WP_Query($args);
                    while($query -> have_posts()) : $query -> the_post();
            ?>
            </div>


      <tbody>
          <th ><?php the_title( '<h5 style="font-size: 16px;" class="entry-title"><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h5>' ); ?></th>
          <td ><?php the_field('tent'); ?></td>
          <td ><?php the_field('laadimise_kp'); ?> <strong>-</strong>  <?php the_field('mahalaadimine'); ?><br></td>
          <td ><?php the_field('from'); ?><strong>-</strong><?php the_field('to'); ?></td> 
      </tbody>


            <?php endwhile; wp_reset_query(); ?>

    </table></div>

Изображения: Как это должно выглядеть против Как это выглядит

Ответы [ 2 ]

1 голос
/ 22 апреля 2020

Я не очень хорошо с WP, но разметку HTML необходимо изменить, так как вы добавляете элемент DIV в таблицу напрямую, что не в порядке, и вы используете WHILE l oop и повторяете элемент TBODY для каждого l oop.

Структура таблицы выглядит следующим образом: 

<table>
    <thead>
        <tr><th>Col Heading</th></tr>
    </thead>
    <tbody>
        <tr><td>Cell Value1</td></tr>
        <tr><td>Cell Value2</td></tr>
    </tbody>
    <tfoot>
        <tr><th>Col Heading</th></tr>
    </tfoot>
</table>

Вам необходимо переформатировать код и структуру, чтобы они были похожи на это.

0 голосов
/ 22 апреля 2020

Я получил его на работу после добавления только одного в шапку и тело 

    <div class="post clearfix">
                <div class="table-responsive">
            <table 
     data-toggle="table"
  data-search="true"
  data-show-columns="true"
 class="table table-striped">
      <thead>
        <tr>
          <th  scope="col">Goods</th>
         <th  scope="col">Tent</th>
         <th   data-sortable="true" scope="col">Load/Unload</th>
        <th   scope="col">From/To</th>
      </tr>

      </thead>



      <tbody>
<?php
                    $args = array(
                        'post_type' => 'post',
                        'posts_per_page' => -1,
                        'meta_query' => array(
                            array(
                                'key' => 'tent',
                                'value' => $tent,
                                'compare' => 'LIKE'
                            ),

                            array(
                                'key' => 'laadimise_kp',
                                'value' => array($laadimise_kp, $mahalaadimine),
                                'compare' => 'BETWEEN',
                                'type' => 'DATE'
                            ),

                            array(
                                'key' => 'from',
                                'value' => $from,
                                'compare' => 'LIKE'
                            ),

                            array(
                                'key' => 'to',
                                'value' => $to,
                                'compare' => 'LIKE'
                            ),
                        )
                    );
                    $query = new WP_Query($args);
                    while($query -> have_posts()) : $query -> the_post();
?>  
         <tr>
    <td><?php the_title( '<h5 style="font-size: 16px;" class="entry-title"><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h5>' ); ?></td>
          <td><?php the_field('tent'); ?></td>
          <td><?php the_field('laadimise_kp'); ?> <strong>-</strong>  <?php the_field('mahalaadimine'); ?><br></td>
          <td><?php the_field('from'); ?><strong>-</strong><?php the_field('to'); ?></td>
    </tr>
                <?php endwhile; wp_reset_query(); ?>
      </tbody>





    </table>
</div>
</div>
...