0
<?php if(isset($_POST["btn-add"])):?>
    <?php $element = 0; ?>
    <?php while($element < 10): ?>
        <?php $statement = $pdo->query("SELECT * FROM dorayaki ORDER BY stock DESC LIMIT $element ,1"); ?>
        <?php if($row = $statement->fetch()): ?>
            <div name ="card" class = "card">
                <?php $doraId = $row["id"] ; ?>
                <p><?php print_r("Name: "."<a name='doraprice' href='detail.php?id=$doraId'>".$row["name"]."</a>"); ?></p>
                <p><?php print_r("Price: "."<a name='doraprice' href='detail.php?id=$doraId'>".$row["price"]."</a>"); ?></p>
                <p><?php print_r("Description: "."<a name='doraprice' href='detail.php?id=$doraId'>".$row["desc"]."</a>"); ?></p>
            </div>
            <?php $element++; ?>
        <?php endif; ?>
    <?php endwhile; ?>
<?php endif; ?>


<form method="post">
    <input type="submit" name="btn-add" value="Add element">
</form>

Every time "Add element" is clicked, I want it to append one 'card' to the html page and if the button is clicked again, it will add one more 'card' until it reaches 10 cards. Instead of appending it one by one, when I clicked the "Add Button", it appends all the cards to the html page in once. How to solve this?

TooGuilty
  • 11
  • 4
  • Database queries in loops are a thing you should avoid to begin with. There is really no good reason here to do it this way. Make a query with `LIMIT row_count OFFSET offset` _before_ the loop instead, and then loop over the result set. – CBroe Oct 21 '21 at 06:22
  • And to show "one more" element each time, you obviously first need to now, how many you had shown the last time. So add a hidden input field to your form, and put your current counter value into to, so that you can access that again after the form is submitted. – CBroe Oct 21 '21 at 06:23
  • You'll have to start learning about the disconnection between the client and server-side in web development (HTTP being a stateless protocol) and how this [can be managed with sessions](https://stackoverflow.com/questions/3804209/what-are-sessions-how-do-they-work). In short: there is no continuous connection between your HTML and PHP code like you appear to think there is. – Decent Dabbler Oct 21 '21 at 06:27

1 Answers1

0

You must save $element in a cookie or a session variable:

<?php session_start(); ?>
<?php if(isset($_POST["btn-add"])):?>
    <?php $_SESSION["element"] = isset($_SESSION["element"])?0:; ?>
    <?php for($i=0;$_SESSION["element"]<$i;$_SESSION["element"]): ?>
        <?php $statement = $pdo->query("SELECT * FROM dorayaki ORDER BY stock DESC LIMIT $element ,1"); ?>
        <?php if($row = $statement->fetch()): ?>
            <div name ="card" class = "card">
                <?php $doraId = $row["id"] ; ?>
                <p><?php print_r("Name: "."<a name='doraprice' href='detail.php?id=$doraId'>".$row["name"]."</a>"); ?></p>
                <p><?php print_r("Price: "."<a name='doraprice' href='detail.php?id=$doraId'>".$row["price"]."</a>"); ?></p>
                <p><?php print_r("Description: "."<a name='doraprice' href='detail.php?id=$doraId'>".$row["desc"]."</a>"); ?></p>
            </div>
            <?php $element++; ?>
        <?php endif; ?>
    <?php endfor; ?>
<?php endif; ?>


<form method="post">
    <input type="submit" name="btn-add" value="Add element">
</form>
Aaron Junker
  • 127
  • 1
  • 14