Show Table Based on Dropdown Selection

Question

I have a dropdown list that is imported with data from a table in a database. The dropdown values consist of a value MR_ID that is concatenated with MR_Name that is located in a different table. Depending on what is selected, I want to display a table that shows the necessary information that correlates to what was selected in the dropdown list. So, for example, if I select "1 - Company A" in the dropdown list, I want the Supp_ID values (can be more than 1 value) that correlate to the "1 - Company A" value to be displayed in a table. How can I do this?

The table is only 2 columns, MR_ID (which is what is displayed in the dropdown list) and Supp_ID.

I had this working before but I had to change my queries to use CTE instead and it threw me off.

HTML Dropdown:

<!-- Form -->    
<form name="myForm" action="">

<!-- Dropdown List -->
    <select name="master_dropdown" id="mr_id">

    <option selected value="select">Choose a MR_ID</option>
        <?php foreach($users->fetchAll() as $user) { ?>
            <option data-name="<?php echo $user['MR_ID'];?>">
                <?php echo $user ['MR_ID'];?>
            </option>
        <?php } ?>
    </select>
</form>

Here are my old and new queries on my main page (index.php)...

// Old query on main page (index.php)
$sql = "SELECT DISTINCT CAST(MR_ID AS INT) AS MR_ID FROM Stage_Rebate_Index";

// New query on main page (index.php)
$sql = "WITH cte AS (
SELECT DISTINCT CONCAT(CAST(Stage_Rebate_Index.MR_ID AS INT),' - ', Stage_Rebate_Master.MR_Name) AS MR_ID
    , Stage_Rebate_Index.MR_ID AS sort_column
FROM Stage_Rebate_Index
LEFT JOIN Stage_Rebate_Master
ON Stage_Rebate_Master.MR_ID=Stage_Rebate_Index.MR_ID
)
SELECT MR_ID
FROM
    cte
ORDER BY
    sort_column;";

Here are my old and new queries on my test-table.php page

// Query that is used in ajax call (test-table.php)
    $sql_one = "SELECT CAST(Supp_ID AS INT) AS Supp_ID, CAST(MR_ID AS INT) AS MR_ID FROM Stage_Rebate_Index WHERE MR_ID = '$mr_id'";

// Query that is used in ajax call (test-table.php)
$sql_one = "WITH cte AS (
SELECT DISTINCT CONCAT(CAST(Stage_Rebate_Index.MR_ID AS INT),' - ', Stage_Rebate_Master.MR_Name) AS MR_ID
    , Stage_Rebate_Index.MR_ID AS sort_column, CAST(Stage_Rebate_Index.Supp_ID as INT) AS Supp_ID
FROM Stage_Rebate_Index
LEFT JOIN Stage_Rebate_Master
ON Stage_Rebate_Master.MR_ID=Stage_Rebate_Index.MR_ID
)
SELECT MR_ID, Supp_ID
FROM
    cte
WHERE
    MR_ID = '$mr_id'
ORDER BY
    sort_column;";

This is my ajax (index.js) along with a line of code that brings in the $_POST value...

// Reads what the user selects from the drop down list and displays table when a selection is made
function updatetable(myForm) {

    function show() { document.getElementById('index-table').style.display = 'block'; }


    var selIndex = myForm.selectedIndex;
    console.log();
    var selName = $( "#mr_id option:selected" ).text();

// Ajax sends POST method to Stage_Rebate_Index table and pulls information based on drop down selection

$.ajax ({
    url: "test-table.php",
    method: "POST", //can be post or get, up to you
    data: {
        mr_id : selName
    },
    beforeSend: function () {
        //Might want to delete table and put a loading screen, otherwise ignore this
    },
    success: function(data){
        $("#table_div").html(data); // table_div is the div you're going to put the table into, and 'data' is the table itself.
    }
 });

}

$_POST method brought in on test-table.php...

$mr_id = $_POST['mr_id'];

test-table.php script...

<?php
$host="xxxxxxxxxxxx"; 
$dbName="xxxxx"; 
$dbUser="xxxxxxxx"; 
$dbPass="xxxxxxxxxxxxxx";

$mr_id = $_POST['mr_id'];

$dbh = new PDO( "sqlsrv:server=".$host."; Database=".$dbName, $dbUser, $dbPass);
$dbh->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );

$sql_one = "WITH cte AS (
SELECT DISTINCT CONCAT(CAST(Stage_Rebate_Index.MR_ID AS INT),' - ', Stage_Rebate_Master.MR_Name) AS MR_ID
    , Stage_Rebate_Index.MR_ID AS sort_column, CAST(Supp_ID as INT) AS Supp_ID
FROM Stage_Rebate_Index
LEFT JOIN Stage_Rebate_Master
ON Stage_Rebate_Master.MR_ID=Stage_Rebate_Index.MR_ID
)
SELECT MR_ID, Supp_ID
FROM
    cte
WHERE
    MR_ID = '$mr_id'
ORDER BY
    sort_column;";


//$users = $dbh->query($sql);
$users_one = $dbh->query($sql_one);
?>

<html>
    <body>

        <!-- Table -->
<p> 
    <div id="table_div">
        <table border="1" id="index_table" class="ui-widget ui-widget-content">
            <thead>
                <tr class="ui-widget-header">
                <td>MR ID</td>
                <td>Supplier ID</td>
                </tr>
            </thead>
            <?php foreach($users_one->fetchAll() as $supp) { ?>
            <tr>
                <td class="mr_id"><?php echo $supp['MR_ID'];?></td>
                <td class="supp_id"><?php echo $supp['Supp_ID'];?></td>
            </tr>
            <?php } ?>
        </table>
    </div>

    </body
    </html

Answer 1

There are a couple of ways that you could debug this and give a bit more information about what is exactly is going on (by looking at the difference in the sets of results you were getting from the previous queries and the current queries, just the queries in isolation). It would be good to know if your updated query is simply returning an empty set of results, or an actual error etc.

Off the top, however, i think there may be a possible problem in your SQL in that you are trying to concatenate an int with a string, here:

CONCAT(CAST(Stage_Rebate_Index.MR_ID AS INT),' - ', Stage_Rebate_Master.MR_Name)

I assume MR_Name is a varchar, and so I'm sure one of the things you would have to do is cast the MR_ID as a varchar and not an int.

There may be other things wrong with the query also, but it would be good to get a better idea of what the actual results are.