PHP Для L oop jQuery Вкладки пользовательского интерфейса

Question

Я пытаюсь отобразить список ссылок в таблице в соответствии с расстоянием и категорией. Я хотел бы, чтобы каждое расстояние было вкладкой и иметь соответствующие ссылки на каждой вкладке. Я пытаюсь выполнить sh это с помощью вкладок A PHP Foreach l oop и jQuery -UI.

Вот код, который получает данные и отображает их в таблице на каждой вкладке .

Индексная функция в контроллере для просмотра и функция, которая получает данные таблицы:

public function index() {
    $data = array();
    $db_name = $this->uri->segment(2);
    $this->db->db_select($db_name);
    $tables = $this->db->get('tableinfo');

    $data['distances'] = array();
    $data['tables'] = array(
        'men' => array(),
        'women' => array()
    );

    foreach($tables->result() as $row) {
        if(!in_array($row->distance, $data['distances'])) {
            array_push($data['distances'], $row->distance);
        }

        if(substr($row->displayname, 0, 4) == "Male") {
            array_push($data["tables"]['men'], $row->displayname);
        } else {
            array_push($data["tables"]['women'], $row->displayname);
        }
    }

    $data['dbname'] = $db_name;

    $this->parser->parse('templates/header', $data);
    $this->parser->parse('select/index', $data);
    $this->parser->parse('templates/footer', $data);
}

public function gettable($table) {
    $db_name = "championchipco_sowetomarathon2019";
    $this->db->db_select($db_name);
    redirect("results/index/" . $db_name . "/" . $table);
}

и просмотр:

<?php
    $i = 1;
    echo "<div class='row'>";
    echo "<div class='col' id='tabs'>";
    echo "<ul>";
    foreach($distances as $distance) {
        echo "<li><a href='#tabs-" . $i . "'>" . $distance . "</a></li>";
    }
    echo "</ul>";
    foreach($distances as $distance) {
        echo "<div id='tabs-" . $i . "'>";
        echo "<table class='table' cellspacing='10'  cellpadding='10'>";
        echo "<tr><th style='font-size: 20px;'>Men</th><th style='font-size: 20px;'>Women</th><th style='font-size: 20px;'></tr>";
        foreach($tables['men'] as $table) {
            if(substr($table, -4) == $distance) {
                echo "<tr>";
                echo '<td><a href="' . site_url("select/gettable/" . $tables['men'][$i])  . '" class="link-class">' . $tables['men'][$i] . '</a></td>';
                echo '<td><a href="' . site_url("select/gettable/" . $tables['women'][$i])  . '" class="link-class">' . $tables['women'][$i] . '</a></td>';
                echo "</tr>";
            }
        }
        echo "</table>";
        echo "</div>";
        $i++;
    }
    echo "</div>";
    echo "</div>";
?>

В данный момент все данные отображаются на каждой вкладке, а не отображаются только ссылки для определенной категории на другой вкладке. Я вижу, что 2-я таблица «Мужчины и женщины» находится немного левее от верхней, поэтому я думаю, что l oop приводит к неправильному выводу go.

Я попытался изменить порядок отображения циклов данных в представлении, но не могу получить только 10 км на вкладке 10 км, 21 км на вкладке 21 км и др. c.

Answer 1

Получите данные вашего второго foreach с помощью Ajax, это сделает вашу потребность простой, как я упоминал, чтобы удалить ниже foreach

 foreach($distances as $distance) {
    echo "<div id='tabs-" . $i . "'>";
    echo "<table class='table' cellspacing='10'  cellpadding='10'>";
    echo "<tr><th style='font-size: 20px;'>Men</th><th style='font-size: 20px;'>Women</th><th style='font-size: 20px;'></tr>";
    foreach($tables['men'] as $table) {
        if(substr($table, -4) == $distance) {
            echo "<tr>";
            echo '<td><a href="' . site_url("select/gettable/" . $tables['men'][$i])  . '" class="link-class">' . $tables['men'][$i] . '</a></td>';
            echo '<td><a href="' . site_url("select/gettable/" . $tables['women'][$i])  . '" class="link-class">' . $tables['women'][$i] . '</a></td>';
            echo "</tr>";
        }
    }
    echo "</table>";
    echo "</div>";
    $i++;
}