Formularz z listami rozwijanymi i Java w aplikacji MVC

Witam, jako że jest to mój pierwszy post szybko dodam że od ponad 6 miesięcy działam w C# .Net jednak mam pewnien problem który związany jest ze stworzeniem widoku w aplikacji MVC. Poniżej postaram się opisać problem i dodać jakiś zarys jak to ma wyglądać.

Na potrzeby zadania napiszę że chodzi o stworzenie formularza dodawania nowego ucznia który to model ucznia posiada następujące składowe(nie wszystkie ale uzyskane rozwiązanie będzie na tyle uniwersalne że nie potrzeba ich tutaj wymieniać)

Uczeń
Imię ucznia
Przedmioty których sie uczy
Wychowawca ucznia

I teraz najważniejsze rzeczy. Moja wizja kreuje się tak iż w widoku dodania nowego ucznia mamy Textbox w którym wpisujemy Imię ucznia oraz listę rozwijaną w której znajdują się składniki informacji o uczniu (przedmioty których się uczy, Wychowawca)

Po wpisaniu jego Imienia przystępujemy do podawania dalszych informacji i teraz z pierwszej listy rozwijanej wybieramy Przedmioty po wybraniu w liście chciałbym aby obok pojawiła się kolejna lista rozwijana w której znajdować się będą przedmioty które chcielibyśmy przypisać do danego ucznia i teraz wybieramy przedmiot i przyciskiem dodajemy go do ucznia.

Po zakończeniu dodawania przedmiotów w pierwszej liście rozwijanej wybieramy Wychowawcy po czym obok (zamiast dotychczas znajdującej się tam listy przedmiotów) pojawiła się lista dostępnym wychowaców z których wybierzemy wychowace dla naszego ucznia.

Poniżej całego pola chce umieścić podsumowanie dotychczas wprowadzonych informacji o naszym uczniu i dopiero tak przycisk do ostatecznego dodania ucznia do bazy danych.

Dla ułatwienia umieszczam poniżej projekt jak mogłoby to wyglądać.

Zwracam się z prośbą do Was o pomoc ale nie oczekuje zrobienia tego za mnie. Temat zakładam dlatego że niezbyt idzie mi z wykorzystywaniem Javy a jeżeli dobrze rozumiem moją wizję użycie Javy pozwoliłoby osiągnąć mi mój cel.

Proszę o naprowadzenie mnie na jakiś sposób jak moge to wykonać (jQuery, Partial View, lub cokolwiek mogłoby to być)

W tym momęcie moim głownym pytaniem jest:

Jak mogę sprawić aby po wybraniu elementu w jednej liście rozwijanej obok pojawiła się odpowiednia lista rozwijana?

Pozdrawiam

Co do wyboru wychowawcy: każdy uczeń ma jednego, więc w dropDownList po prostu zaznaczamy jednego tyle. Jeśli chodzi o zrobienie dropDown-a z przedmiotami które potem "przeskoczą" do listy obok, to średnio wiem jak zrobić, natomiast umiałbym wygenerować listę tych przedmiotów z checkBox-ami obok każdego.

nie rozumiem do końca jak napisałeś że średnio wiesz o co chodzi z "zrobienie dropDown-a z przedmiotami które potem "przeskoczą" do listy obok" po prostu pierwsza lista rozwijana w której wybieram albo przedmioty albo wychowaców i wtedy po wybraniu jednego z tych pojawia się lista obok z dostępnymi przedmiotami lub wychowawcami zależnie od poprzedniego wyboru.

zwykła lista jest własnie nie najlepsza a to dlatego że przedmiotów może być sporo i taka lista mogła by powodować rozjeżdżanie się strony a ma ona pozostać mozliwie kompaktowa

Totaolnie nie rozumiem więc chyba się przestanę wypowiadać.... Ale zrozumiałem twoje słowa tak: w jednej liście wybieram wychowawce, a potem w drugiej ....też mogę wybrać wychowawcę... więc to jest totalnie bez sensu.

nie w pierwszej liście wybieram że dla ucznia chcę dodać wychowacę i z tej listy wybieram pozycję wychowawca w tym momęcie obok pojawia się lista rozwijana zawierająca listę wychowawców z których wybieram jedną konkretną pozycję np. wychowawca 5

pierwsza lista zozwijana jest po prostu listą zbiorów (zbiór przedmiotów, zbiór wychowawców) z których chce w kolejnej liście wybrać konkretne wartości

jutro rano dopiero wrzoce

Tak jak pisałem przesyłam Ci ten kod. Polega to na tym że jak wybierzesz sobie kraj, to potem wyskakuje Ci lotnisko. W dwóch różnych dropDown-ach.

1. Tak wygląda główny widok:

@model Models.FlightModel

@{
     var ajaxOptions = new AjaxOptions
                          {
                              UpdateTargetId = "o",
                              OnSuccess = @"onAjaxSuccess()"
                          };
}

<script src="~/Scripts/jquery-1.10.2.min.js"></script>

<script>
    var onAjaxSuccess = function () {
        $('#AirportId').val($('#AirportIdField').val());
        $('#AirportIdField').change(function () {
            $('#AirportId').val($('#AirportIdField').val());
        });
    };

    $(function () {
     
        $('#CompanyId').val($('#CompanyIdField').val());
       

        $('#CountryIdField').change(function () {
            $('#form-id').submit();
            $('#AirportId').val($('#AirportIdField').val());
        });
        
    });
</script>
<br />


@using (Ajax.BeginForm("Airports", null, ajaxOptions, new { id = "form-id" }))
{
    <div class="form-group">
        @Html.Label("Choose Country", new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("CountryIdField", (SelectList)ViewBag.country, "---Select---")
        </div>
    </div>
}
<br />
<div id="o">
    @Html.Action("Airports")
</div>

<br />
<br />
@using (Html.BeginForm("Add", "Flight"))
{   
        @Html.Hidden("CompanyId")
        @Html.Hidden("AirportId")

    <input type="submit" name="Add" />
}
<div>
    @Html.ActionLink("Back to List", "Index")
</div>

2. Widok Airports:

<div class="form-group">
    @Html.Label("Choose airport", new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.DropDownList("AirportIdField", (SelectList)ViewBag.airports)
    </div>
</div>

3. A tak mniej więcej wygląda kontroler:

  public PartialViewResult Airports(int countryIdField = 0)
        {
            List<Airport> items = this.airportRepository.Airports().Where(x => x.Country.Id == countryIdField).ToList();
             var itemss = items.Select(x => new { Name = x.Name, id = x.Id });
             var itt = itemss.OrderBy(x => x.Name);
             ViewBag.airports = new SelectList(itt, "Id", "Name");
            return this.PartialView();
        }

 public ActionResult Index()
        {
            ViewBag.country = new SelectList(this.countryRepository.Countries(), "Id", "Name");
            return this.View();
        }