Please assist on a basic question

This is a novice question for many of you.

I am creating a intranet site. I have 5 Departments. There are few subdepartments under those 5 departments.

There are few other categories under the subdepartments. Its very similar to OLX classifieds.

When you click a particular category, there are other fields populated, like if you select Mobiles, there are fields like Manufacturer populated on the left and you can click on them to sort the results.

If you click on another category, the fields related to that category are popluated.

How is this done ? Are these fields populated from SQL? Is Ajax necessary ?

How to create a onclick function for the category selected to display the results and show extra filters on the left side?

Hope i asked the question properly. Please, please help me understand the logic and the code.

Many thanks.

This is just MySQL select.

This can be done without AJAX.

Just PHP and MySQL is enough.

Here is a pretty good read: http://www.yourinspirationweb.com/en/how-to-create-chained-select-with-php-and-jquery/

Thank you very much !
Will try that and update.

that worked … Thank you sooooo very much !!!

I got it working for 2 <select>

Just posting the code here if someone might ned help with it.

I have a div that shows the extra elements shown from the selection of the second select.

 <script type="text/javascript">
            $(document).ready(function(){
                 
                 $("select#category").change(function(){
                 var id = $("select#category option:selected").attr('value');
                 $.post("results.php", {id:id}, function(data){
                 $("#myresults").html(data);
                 });
                 $.post("select_type.php", {id:id}, function(data){
                 $("select#type").html(data);
                 });
            });
               $("select#type").change(function(){
                var id = $("select#type option:selected").attr('value');
                $.post("results.php", {subid:id}, function(data){
                $("#myresults").html(data);
                });
                $.post("getextra.php", {id:id}, function(data){
                $("#mydiv").html(data);
                });
               
            });
            });
        </script>

<form id="select_form">
            Choose a category:<br />
            <select id="category" >
               <?php echo $opt->ShowCategory(); ?>
            </select>
            <br /><br />
 
           choose a type:<br />
            <select id="type">
                <option value="0">choose...</option>
            </select>
            <br /><br />
            
            <div id="mydiv"> </div>
            
</form>

<div id="myresults"></div>

So i get the desired output on mydiv and myresults. I am working on hiding mydiv if nothing from <select =type> is selected. Please reply if you can assist on the if() for jQuery.

Thanks.

I used a show() and hide().

Is this the proper way to do ?

That is likely what I would have done too.