asp.net MVC Umgang mit Abhängigkeiten zwischen den Eingabesteuerungen?

Question

Ich habe eine Anwendung, die zwei abhängige Dropdown-Listen hat, wo, wenn der Benutzer einen Wert in Listenfeld A auswählt, die zur Verfügung stehende Menge von Eingaben in Listenfeld B. Updates wie Marke / Modell eines Autos. wenn der Benutzer die Hersteller wählt, würde die Liste der Modelle entsprechend aktualisieren.

In WinForms, würde dies nur in der Autopost zurück Fall behandelt werden. Welche Technik / Ansatz sollte ich in asp.net MVC? wird durch AJAX getan? nur versuchen, auf MVC Geschwindigkeit aufstehen und suchen Strategien zu bauen gemeinsame Aufgaben zu bewältigen, frage ich mich bei der Arbeit zu behandeln.

Ich wollte allen danken, die an der Beantwortung dieser Beitrag beigetragen.

Answer 1

Ich würde tun dies durch Ajax. Wenn Sie diese Kontrollen haben:

<select id="makes" /> und <select id="models" />

, dann können Sie tun dies mit jquery:

$().ready(function() {
   $("select#makes").change(function() {
        var make = this.value;          
        $.getJSON('models/list?make=' + make, function(data) {
              //load 2nd dropdown with result
        })
   });
});

Dann müssen Sie würde nur eine Aktion auf dem ModelsController genannt List (), die eine JSON-Datenstruktur zurück.

Answer 2

Das Sie verwenden ASP.NET MVC ist etwas irrelevant. Sie haben grundsätzlich drei Optionen für diese Art von UI-Mechaniker auf einer Webseite.

1. Wenn die Daten in Ihren Listen relativ klein ist und selten zu ändern, kann es am einfachsten sein, nur um Vorbelastung alle möglichen Daten auf der Seite in der ursprünglichen Anforderung entweder in so etwas wie ein Javascript-Array oder versteckte Elemente in der Seite Markup. Wenn der Wert von Box A ändert, javascript ersetzt nur den Inhalt der Box B mit den entsprechenden Daten. Dies geschieht alles ohne Anfragen an den Server zurück, die es sehr schnell macht. Aber diese Methode bricht, wenn die Größe Ihrer Daten beeinflussen die Reaktionszeit der ursprünglichen Seite zu laden.

2. Wenn die Daten in Ihren Listen groß ist oder häufig wechselnde (innerhalb des Zeitrahmens ein Benutzer auf der Seite eine Entscheidung wäre), die Legacy-Methode zu haben, ist nur die Seite mit den neuen Abfrage Argumenten wieder geladen werden wenn der Wert der Box A ändert. Code auf dem Back-End stellt die Ausgabe auf den neuen Argumenten basiert. Je nachdem, wie komplex der Rest des Rendering-Code in Ihrer Seite, das kann teuer werden.

3. Dies ist eine Variation auf Option 2 und ist im Grunde die Antwort Ben Scheirman über Ajax gab. Sie laden immer noch den Inhalt der Box B auf Anfrage bei Box A ändert. Der Unterschied ist, dass Sie nur das Stück der Seite neu zu laden, die nicht die gesamte Seite geändert hat.

Persönlich, wenn Ihre Daten klein genug ist, Option 1 zu verwenden, das ist wahrscheinlich das, was ich mit wegen seiner Leistung gehen würde. Andernfalls gehen Sie mit der Option 3, vor allem, wenn Sie bereits bereits umgesetzt anderen Ajax-bezogene Dinge bekamen. Option 2 scheint ein Vermächtnis Mechaniker von vielen Menschen in diesen Tagen berücksichtigt werden.

Answer 3

Funktionell würde es funktioniert diese beide Drop-Listen in ihrer eigenen Teilansicht zu platzieren und dann wieder nur, dass, wenn der Wert in ListA ausgewählt ist. Wenn das nicht möglich zu Layoutzwecken ist, dann Bens Methode oben sieht gut aus.