Question

J'ai une application qui a deux listes déroulantes dépendantes, où si l'utilisateur sélectionne une valeur dans la zone de liste A, il met à jour l'ensemble des entrées disponibles dans la zone de liste B. comme la marque / modèle d'une voiture. lorsque l'utilisateur sélectionne le fabricant, la liste des modèles actualisera en conséquence.

Dans WinForms, ce serait tout simplement être traités de la autopost retour événement. Quelle technique / approche dois-je prendre en asp.net MVC? est fait par AJAX? juste essayer de se lever à la vitesse sur MVC et qui cherchent à élaborer des stratégies pour gérer les tâches courantes, je me demande de gérer au travail.

Je voulais remercier tous ceux qui ont contribué à répondre à ce poste.

Était-ce utile?

La solution

Je le fais par ajax. Si vous avez ces contrôles:

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

vous pouvez le faire avec jquery:

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

Ensuite, il suffira d'avoir une action sur la ModelsController appelée Liste () qui retourne une structure de données JSON.

Autres conseils

Que vous utilisez ASP.NET MVC est un peu hors de propos. Vous avez essentiellement trois options pour ce type de mécanicien interface utilisateur sur une page Web.

  1. Si les données de vos listes est relativement faible et changeant souvent, il peut être plus simple d'effectuer une pré-charge toutes les données possibles sur la page dans la demande initiale soit quelque chose comme un tableau javascript ou des éléments cachés dans la balisage de la page. Lorsque la valeur de la case A change, javascript remplace simplement le contenu de la boîte B avec les données appropriées. Cela arrive tout sans aucune demande au serveur qui le rend très rapide. Mais cette méthode se décompose lorsque la taille de vos impacts de données, le temps de réponse de la charge de la page initiale.

  2. Si les données de vos listes est grande ou changeant fréquemment (dans le délai d'un utilisateur serait sur la page de prendre une décision), la méthode héritée est d'avoir juste la page se rechargées avec les nouveaux arguments de la requête lorsque la valeur de la case A change. Code sur le back-end ajuste la sortie sur la base des arguments nouveaux. Selon la complexité du reste du code de rendu dans votre page, cela peut être coûteux.

  3. Ceci est une variation sur l'option 2 et est essentiellement la réponse Ben Scheirman a donné au sujet ajax. Vous chargez toujours le contenu de la boîte B à la demande lorsque la case A change. La différence est que vous rechargeant que le morceau de la page qui a changé plutôt que la page entière.

Personnellement, si vos données est assez petit pour utiliser l'option 1, qui est probablement ce que j'irais avec en raison de ses performances. Sinon, passez à l'option 3, surtout si vous avez déjà d'autres choses liées ajax déjà mis en œuvre. L'option 2 est semble être considéré comme un mécanicien héritage par beaucoup de gens ces jours-ci.

Fonctionnellement il travaillerait à placer ces deux listes déroulantes dans leur propre vue partielle et revenir juste que quand est sélectionné la valeur ListA. Si cela est impossible à des fins de mise en page, puis méthode de Ben regarde au-dessus bien.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top