Jquery – Integrating jquery with AJAX using MVC for ddl/html.dropdownlist

ajaxasp.net-mvcdrop-down-menujquerylinq-to-sql

The situation:
A user on the page in question selects a category from a dropdown which then dynamically populates all the users of that category in a second dropdown beside it.

All the data is being retrieved using LinqtoSQL and I was wondering if this can be done
a) Using html.dropdownlist in a strongly typed view?
b) Using jquery to trigger the ajax request on selected index change instead of a 'populate' button trigger?

Sorry I don't have code as what I was trying really wasn't working at all. I am having trouble with how to do it conceptually and programatically!

Will appreciate any links to examples etc greatly!

Thanks in advance!

EDIT:

This is kind of what I was trying to achieve.Dirst the
ViewPage:

       <script type="text/javascript">
        $(document).ready
            function TypeSearch() {
                $.getJSON("/Home/Type", null, function(data) {
                    //dont know what to do here

                });

            }
        </script>

        <p>
              <label for="userType">userType:</label>
            <%= Html.DropDownList("userType") %>
            <%= Html.ValidationMessage("userType", "*") %>
          <input  type="submit" runat="server" onclick="TypeSearch()" />

            <label for="accountNumber">accountNumber:</label>
            <%= Html.DropDownList("accountNumber") %>
            <%= Html.ValidationMessage("accountNumber", "*") %>
        </p>

Then home controller action:

    public ActionResult Type()
    {
        string accountType = dropdownvalue;
        List<Account> accounts = userRep.GetAccountsByType(accountType).ToList();

        return Json(accounts);
    }

Best Solution

just coding outloud here but you might want to do something like the following

public void Type(string accountType)
{
    List<Account> accounts = userRep.GetAccountsByType(accountType).ToList();

    Json(accounts).ExecuteResults(this.ControllerContext);
}

with the following jQuery script

$(document).ready(function() {
    $("#dropdownid").change(function() {
        $.getJSON(
            "/Home/Type/" + $("#dropdownid :selected").val(),
            "[]",
            function(data) {
                $("#seconddropdownid").empty();
                $.each(data, function() {
                    $("#seconddropdownid").append("<option>" + this.Property + "</option>");
                });
            }
        );
    });
});

this is all off the top of my head and might be some syntax errors, however, you can get the jist.