Bind ListBox Baed On Another ListBox Selection using jQuery Ajax in Asp.Net MVC

Question

i have a database structure like this;

And in my view, i have shown them like this;

Now, what i want is, if someone select category, i should call ajax request and send to the controller and then return back the related ie subcategories (the categoryId that is passed in) and display them in another listbox.
Note: it is my requirement. I don't need to use dropdownlist. And i need to do this using ajax call. Alittle descriptive answer would be much appreciable

Answer 1

General flow 1. Get change event 2. Call the controller - i used razor example 3. Get Data 4. Use the Data

$("#category").bind('change', function () {                  
                    if ($('#category').val().length != 0) {
                        //Send Value
                         $.ajax({                       
                        url: '@Url.Action("Action", "Controller")',
                        type: 'POST',
                        data: { category: $('#category').val()},   
            sucess : function(data) {
                //add the data to your sub category
            }                    
                        }),                           
                });

Note : Just a sample code you need to change to work with your requirment as Brian mentioned please also post the code that you have already completed.

Thanks