Как ограничить количество ячеек на строку в HTML-таблице из базы данных с помощью PHP

Question

Я пытаюсь настроить интернет-магазин для своего сайта.Я планирую разделить его на три категории (эта часть уже работает), а затем перечислить элементы из базы данных MySQL в таблицу.

Я уже знаком с тем, как использовать функцию LIMIT MySQL для ограничения результатов, но я хочу, чтобы он перечислял все элементы из базы данных, которые соответствуют категории, к таблице и ограничил ее максимум тремя элементами в строке.

i.e.

Table

Item1 Item2 Item3

Item4 Item5 Item6

Item7 etc. etc.

Из-за того, что я перечисляю несколько элементов в категории, нумерация страниц не обязательна.

Как бы я начал пытаться настроить это правильно с помощью цикла while?Я видел кое-что о функции слайса с PHP, но не уверен, что это соответствует моим потребностям.

У меня есть базовый цикл, работающий как задумано, я просто не уверен, где начать разбивать цикл наразные строки в таблице.Я выполнил поиск в Google, и больше всего я нашел что-то, связанное с нарезкой, но это не было связано с функциями массива выборки MySQL.

$sql = $db->query('SELECT * FROM store_items WHERE store_cat = "Apparel"');
    if(is_object($sql) && $sql->num_rows > 0)
    {
        while($row = $result->fetch_array())
        {           
            echo '<tr>';
            echo '<td height="250">';
            echo '<img src="" alt="" height="180" /><br />'.$row['store_name'];
            echo '<br /><br />\$'.$row['store_price'].'<br />'.$row['store_desc'];
            echo '<br /><href="">Add to Cart</a>';
            echo '</td>';
            echo '</tr>';
        }
    }

Я бы хотел, чтобы цикл while выводил данные из базы данных.в строках по 3 предмета в каждом.Прямо сейчас он выводит данные только в 1 строку, если только я не выполню другой запрос для каждой строки (и столько же циклов while).

Answer 1

Как, вы хотите отобразить элемент с изображениями.Попробуйте CSS Grid, чтобы отобразить его.Таким образом, вы будете иметь больше контроля над его разметкой экрана.Здесь я использую загрузочные сетки , вы можете использовать разные, если хотите.

$sql = $db->query('SELECT * FROM store_items WHERE store_cat = "Apparel"');
    if(is_object($sql) && $sql->num_rows > 0)
    {
        echo '<div class="row">'; //Bootstrap Row 

        while($row = $result->fetch_array())
        {           

            echo "<div class= 'col-md-4'>"; //Bootstrap Column
            echo '<img src="" alt="" height="180" /><br />'.$row['store_name'];
            echo '<br /><br />\$'.$row['store_price'].'<br />'.$row['store_desc'];
            echo '<br /><href="">Add to Cart</a>';
            echo '</div>';

        }
         echo '</div>';
    }

В приведенном выше коде мы делим доступную ширину на три равные части.
Это просто вопрос стиля, ваш код в порядке.Если вы просто хотите этого добиться, избегайте ненужных кодов или логики, которые только снижают производительность.
Таким образом, у вас будет больше возможностей, вы можете стилизовать изображения и теги под ним.Существуют другие классы начальной загрузки для миниатюр изображений .

Answer 2

$row = fetch();
while($row) {
  echo '<tr>';
  for($i = 0; $i < 3; ++$i) {
    echo '<td>';
    if ($row) {
       //print the card here
       //then fetch next row
       $row = fetch();
    } else {
       //nothing needs be done here, since you are just generating empty td tags 
       //to keep the table aligned - same number of columns in all rows. 
       //but you can place here something too.
    }
    echo '</td>';

  }
  echo '</tr>';
}

Answer 3

Вы можете попробовать ниже.Определил переменную и проверил модуль (%), затем напечатал tr open / close соответственно.См. Комментарий в приведенном ниже коде для получения более подробной информации.

$sql = $db->query('SELECT * FROM store_items WHERE store_cat = "Apparel"');
if(is_object($sql) && $sql->num_rows > 0)
{
    $index = 0; // Define variable for store the indexes 
    while($row = $result->fetch_array())
    {
        if($index % 3 == 0) echo '<tr>'; // Check modulus (%) of $index. Open tr if the modulus is 0
        echo '<td height="250">';
        echo '<img src="" alt="" height="180" /><br />'.$row['store_name'];
        echo '<br /><br />\$'.$row['store_price'].'<br />'.$row['store_desc'];
        echo '<br /><href="">Add to Cart</a>';
        echo '</td>';
        $index++; // Increment the value of $index
        if($index % 3 == 0) echo '</tr>'; // Check modulus (%) of $index. Close tr if the modulus is 0
    }
}

Если вы хотите напечатать 4 столбцы, просто измените проверку if($index % 3 == 0) на if($index % 4 == 0)

Answer 4

Я настоятельно рекомендую CSS-сетку для этого.Таким образом, вы указали бы количество элементов в строке в вашем css, и вам не пришлось бы беспокоиться о правильном размещении тега tr.Я буквально должен искать сетку CSS каждый раз, когда мне нужно ее использовать, и я нахожусь на мобильном телефоне, поэтому у меня нет примера.

Но с вашей текущей настройкой вы можете сделать:

$count=0;
echo '<tr>';
while(...){ 
    $count++;
    //your other code
    if ($count%3===0)echo '</tr><tr>';
}
echo '</tr>';

Как я сейчас написал, у вас может получиться пустая строка в конце, если есть элементы, кратные 3. Но я сейчас мобильн, поэтому я оставлю это вам.