mardi 6 octobre 2015

How to add checkbox to each query result?

I have a problem with this code. I'm listing a couple of products on my page and each of them has a checkbox from query. I would like to compare max two of the products with the „compare“ button. So first, I would „check“ the two products and then click „compare“ button which would then redirect me to another page, where those two products would be compared.

The problem comes after I click the first one (checkbox), it enables the „compare“ button but the rest of „checked“ checkboxes do not enable the „compare“ button. So only and always the first one works but when I click second or third etc. it doesn't do nothing.

    <?php
     
    $query = "SELECT * FROM artikli WHERE kategorija='laptop'";

    $result = mysqli_query($con, $query);
                    while ($row = mysqli_fetch_array($result)) {

                        $id = $row ['id'];

                        print
                                "<div id='proizvod'></br><a style='text-decoration:none; color:black;' class='two' href='proizvod.php?id=$id' >" . $row["naziv"] . "" .
                                "<p><img src=" . $row["slika"] . " width='200px' height='200px' style='border-radius: 15px;'></p>" .
                                "<p> Cijena za gotovinu: " . $row["cijena"] . " KN </p>" .
                                "<pre id='pre1'>" . $row["opis"] . "</pre>" .
                                "</a>**<input type='checkbox' id='checkme'/>**</div>
    }
    ?>

<form>             
                    
                    <input type='submit' name='usporedi' disabled='disabled' id='usporedi' value='Usporedi'  />

                    <script language='javascript'>
                        var checker = document.getElementById('checkme');
                        var usporedi = document.getElementById('usporedi');
                        // when unchecked or checked, run the function
                        checker.onchange = function () {
                            if (this.checked) {
                                usporedi.disabled = false;
                            } else {
                                usporedi.disabled = true;
                            }

                        }
                    </script>
                </form>



Aucun commentaire:

Enregistrer un commentaire