When is selected -> show column names of this table (PHP,MySQL=

Question

i am new to stackoverflow, so correct me if i am talking nonsense ;)

My Problem: I´ve got a text.php where 2 are. In the first i select a table (like "accounts", "customers", and so on). The second shows the column names of the selected table. The page should not refresh when the first changes! What i´ve done so far: I managed to get a connection to the MySQL Database (xampp if this is important idk). The tables show up in the first . So howcan i achieve that the column names show up in the 2nd ? I heard of AJAX, JQuery but i dont know anything about it.

'index.php'
<form>
    <div>
    <?php
        //connection ($link is included in the <head>)
        if (!$link) {
            die("Connection failed: " . mysqli_connect_error());
            }
        //SQL-Statement and Query
        $sql1 = "SELECT * FROM tables";
        $result = mysqli_query($link, $sql1);
        ?>
        <select name="tableselect" id="tableselect" size="10">
            <?php
            if (mysqli_num_rows($result) > 0) {
                while($row = mysqli_fetch_assoc($result)) {
            ?>
            <option><?php echo $row['name']; ?></option>
                <?php }
            }
            ?>
        </select>

//second <select>
        <?PHP

            $sql2 = "SELECT COLUMN_NAME 
            FROM INFORMATION_SCHEMA.COLUMNS 
            WHERE 
                TABLE_SCHEMA = Database()
                AND TABLE_NAME = '$variable' ;";
            $result = mysqli_query($link, $sql2);
            echo $sql2
        ?>
        <select name="fieldnames" id="fieldnames" size="10">
            <option>*</option>
            <?php
                while($row=mysqli_fetch_array($resultf)) {
                ?>
                <option><?php echo $row['COLUMN_NAME']; ?></option>
                <?php }
            ?>
        </select>
        </div>
    </form>

I thought that $variable means that the name of the selected table (from 1st ) must be placed in this variable.

Any help would be nice :) If anything should be styled better let me know :D

`I heard of AJAX, JQuery but i dont know anything about it.` There's your answer. This is not a free tutorial site unfortunately, you'll have to do the research and learn the required techniques. The short answer is that you need to add an onchange listener to your first select, then populate the 2nd select by requesting the 2nd — , Apr 28 '22 at 12:46
This pattern is sometimes called "cascading dropdowns" or "dependent dropdowns" and is quite commonly implemented. Usually, in a web application, AJAX is a key part of the solution so yes you'll need to learn it. (You don't need jQuery necessarily, unless you want to use the specific AJAX implementation in that library. You can equally well use the built-in fetch() function to do the same job.) — ADyson, Apr 28 '22 at 13:10

score 0 · Answer 1 · answered Apr 28 '22 at 14:07

Yes, you achieve this easily by using JQuery Ajax or VueJS/Axios. Check out this tutorial Dynamic Dependent Select Box using jQuery, Ajax and PHP

This is also possible with alpinejs fetch if you don't want to use heavy frameworks.

Check out the answer here. AlpineJS for dynamic select menu

When "anyTableName" is selected -> show column names of this table (PHP,MySQL=

1 Answers1

When is selected -> show column names of this table (PHP,MySQL=