Question

我正在制作一个演示餐厅菜单订单页面。每个选定的菜单项被推入会话数组（仅存储项目ID）。然后我显示确认订单。

我通过从数据库中提取行来动态创建和填充菜单项详细信息的div，其中1行进入1 div（堆叠在彼此的顶部）。在每4个项目之后，我会开始一个新的列＆＃39; - 包含div的第二个＆＃39; /包含div旁边的div，接下来的4个项目放在这个包含div中。在每12个项目之后，我开始一个新页面（比如开始一个新表）。因此页面上的排列是3列，每列4行。

我已经选择从订单中删除菜单项。我可以从数组中删除该项目，但是当页面重新加载时，该项目有一个空白区域，并且我没有重置跟踪每4或12行的计数系统，因此添加新项目或删除项目会混淆我设置的4排系统。

有没有办法转移＆＃39;每次删除一个项目时，这些项目都会重新填充div，因此没有空格，每个＆＃39;列总共最多有4个项目。

我还可以使用实际的表格来显示项目（而不是div），如果这样可以“转移”#t;物品更容易。

我是PHP的新手，所以我编写的东西可能不是最好的方式（我还在学习！）

<section data-state="order">

<div class="pageContainer">

    <div class="menuColumn">
        <?php   
            // loop through session order array                                                 
            foreach ($_SESSION['order'] as $key => $value) {

                // get info from db for items in array
                $query = "SELECT id, name, price, image FROM tblMenuItems WHERE id = '$value'";

                $result = @mysqli_query($connect_db,$query);        

                while ($row = mysqli_fetch_row($result)) {
                    // store data in variables
                    $id = stripslashes($row[0]);
                    $name = stripslashes($row[1]);
                    $price = stripslashes($row[2]);
                    $image = stripslashes($row[3]);

                    $total += $price;

                    // after 4 items, start a new 'column'                              
                    if ($key % 4 == 0 && $key != 0) {
                        echo '
                        </div> <!-- end .menuColumn -->

                        <div class="menuColumn">
                        ';
                    }

                    // after 12 items, start a new section (page)
                    if ($key % 12 == 0 && $key != 0) {
                        echo '
                            </div> <!-- end .menuColumn -->
                            </div> <!-- end .pageContainer -->
                            </section> <!-- end section -->

                            <section data-state="order">
                            <div class="pageContainer">
                            <div class="menuColumn">';
                    }

                    // display ordered items and info on page
                    echo '
                    <form action="#" method="post">
                        <div class="menuItem">
                            <img class="imgMenuItem" src="images/'.$image.'" alt="Menu Item">
                            <h4>'.$name.'</h4> 
                            <h5>$'.$price.'</h5>
                            <input type="submit" name="btnRemoveItem" class="btnRemoveItem" value="Remove Item">    
                            <input type="hidden" name="remove" value="'.$id.'">           
                        </div> <!-- end .menuItem -->
                    </form>

                    <br class="clear">
                    ';
                } // end while

            } // end foreach 

        ?>

    </div> <!-- end .menuColumn -->

</div> <!-- end .pageContainer -->

要从数组中删除项目，我在页面顶部显示：

<?php
if (isset($_POST['btnRemoveItem'])) {       
    // remove menu item from array (including all multiples)
    foreach (array_keys($_SESSION['order'], $_POST['remove']) as $remove) {
        unset($_SESSION['order'][$remove]);         
    }
}

＆GT;

Answer 1

您可以将键设置为unset()而不是null，当您遍历数组时，检查它是否为null并在该位置呈现空白div。

动态删除一个cell / div后如何移动cell / div内容？

1 个答案: