Skip to content Skip to sidebar Skip to footer

Send Select Dropdown To Another Select Dropdown

I'm making a website to learn coding and am making 2 select dropdowns that will have 1 be populated from the database table -> cat. The other select dropdown will be populated f

Solution 1:

You need to make an ajax call to query the database in the background, then return the results (as HTML) and populate your subcategory select.

<selectname="cat"id="cat">...</select><selectname="subCat"id="subCat">...</select><scriptlanguage="javascript">
    $('#cat').change(function() {
        $.post('getSubcat.php', {
           cat: $(this).val()
        }, function(data) {
            $("#subCat").html(data);
        }
    });
</script>

Make sure your getSubcat.php script echoes the results as

<optionvalue='whatever'>Label</option><optionvalue='whatever2'>Label2</option> ...

getSubcat.php would be a simple query / output script:

<?php$category = $_POST['cat'];

$query = "SELECT * FROM subcategories WHERE parent_category = " . $category;
$result = mysql_query($query);

echo"<option value='0'>Select a subcategory</option>";
while($row = mysql_fetch_array($result)) {
    echo"<option value='" . $row['id'] . "'>" . $row['subcategory_name'] . "</option>";
}

NOTE: This utilizes jQuery - make sure your page includes the jQuery libraries

<scriptsrc="http://code.jquery.com/jquery-latest.min.js"></script>

Post a Comment for "Send Select Dropdown To Another Select Dropdown"