Unable to fetch food name from its corresponding category

Question

I am trying to fetch food name from its corresponding category name. I mean, i need when a user selects a category from first drop down, then from second drop down its related food names attached to that category should be displayed. For example, i selected Category Pizza, then in food names, food items that are allocated to Category Pizza should be displayed. But i am unable to fetch food names. Here is what i have done so far

<div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label>Select Category</label>
                            <div class="styled-select">
                                <select name="category">
                                    <option>Select Category</option>
                                    <?php
                                        $SelectMainCats = mysqli_query($con, "SELECT * FROM categories WHERE `merchant_id` IN ('".$userId."','0')");
                                        while($row=mysqli_fetch_assoc($SelectMainCats)){
                                    ?>
                                    <option value="<?php echo $row['id']; ?>"><?php echo $row['cat_name']; ?></option>
                                    <?php } ?>
                                </select>
                            </div>
                        </div>
                    </div>
                    
                    <script>
                    function showHint1(str) {
                        if (str.length == 0) { 
                            document.getElementById("txtHint").innerHTML = "";
                            return;
                        } else {
                            var xmlhttp = new XMLHttpRequest();
                            xmlhttp.onreadystatechange = function() {
                                if (this.readyState == 4 && this.status == 200) {
                                    document.getElementById("txtHint").innerHTML = this.responseText;
                                }
                            }
                            xmlhttp.open("GET", "get_food_items.php?cat_id="+str, true);
                            xmlhttp.send();
                        }
                    }
                    </script>
                    
                    <span id="txtHint">
                        <div class="col-md-12 form-group">
                            <label for="">Select Food</label>
                            <select class="form-control" name="sub_cat_id">
                                <option value="">Select Food</option>
                            </select>
                        </div>
                    </span>
                </div>

Then get_food_items.php code

<?php 
error_reporting(0);
session_start();
include("include/config.php"); 
$cat_id = $_GET['cat_id'];
?>                  
<div class="col-md-12 form-group">
    <label for="">Select Food</label>
    <select class="form-control" name="sub_cat_id"  required  >
        <option value="">Select Food</option>
        <?php
            $SelectmainCat = mysqli_query($con, "SELECT * FROM food WHERE category='$cat_id' ");
               while($row=mysqli_fetch_assoc($SelectmainCat)){
        ?>
        <option value="<?= $row['food_id']; ?>"><?= $row['food_name']; ?></option>
        <?php } ?>
    </select>
</div>

DB images are attached as well

I don't see where you have any event handling setup. Where do you define the change event handler for the category select list? You also can't just return some html and have it replace an existing html element. You need to write some javascript code to do that — gview, Feb 25 '22 at 23:54
**Warning:** You are wide open to [SQL Injections](https://php.net/manual/en/security.database.sql-injection.php) and should use parameterized **prepared statements** instead of manually building your queries. They are provided by [PDO](https://php.net/manual/pdo.prepared-statements.php) or by [MySQLi](https://php.net/manual/mysqli.quickstart.prepared-statements.php). Never trust any kind of input! Even when your queries are executed only by trusted users, [you are still in risk of corrupting your data](http://bobby-tables.com/). [Escaping is not enough!](https://stackoverflow.com/q/32391315) — Dharman, Feb 26 '22 at 10:09

score 0 · Accepted Answer · answered Feb 27 '22 at 13:22

0

thanks to all. I was just missing this in

onChange="showHint1(this.value)"
<select onChange="showHint1(this.value)">

I wrote that and it went well.

answered Feb 27 '22 at 13:22

Syed Hassan Mujtaba Zaidi

34
7

Unable to fetch food name from its corresponding category

1 Answers1