2009-10-18 14 views
8

Ich habe 3 Dropdown-Listen für Land, Staat und Metro. Ich möchte, wenn der Benutzer seclect Land dann Staat Dropdownlist JQuery zu füllen und wenn wählen Sate dann Metro Dropdownlist-fill (wie Kaskadierung von Dropdownlist Ajax) .Diese Prozess i mit JQuery tun wollen.Bind DropDownlists mit JQuery in Asp.Net

Antwort

10

Ich werde es in ASP.NET MVC beschreiben, aber das gleiche kann erreicht werden, wenn Sie entweder einen ASP.NET-Webdienst schreiben oder einfach ein paar Seitenmethoden in Ihren Code einfügen, um das gleiche zu tun - Sie ' Außerdem benötigen Sie einen JSON-Serializer, entweder eine Drittanbieterlösung oder die in WCF.

MVC verwenden, lassen Sie uns zuerst drei Controller-Aktionen haben - ein um die Seite anzuzeigen, Länder statisch sein wird, und zwei, die Zustände und U-Bahnen bzw. zu erhalten:

public ActionResult Index() 
{ 
    ViewData["Countries"] = _countryRepository.GetList(); 
    return View(); 
} 

public ActionResult States(string countryCode) 
{ 
    var states = _stateRepository.GetList(countryCode); 
    return Json(states); 
} 

public ActionResult Metros(string countryCode, string state) 
{ 
    var metros = _metroRepository.GetList(countryCode, state); 
    return Json(metros); 
} 

Nach Ansicht haben Sie drei Dropdownlists, ist man auf das Bildschirmtextsystem gebunden [ „Länder“] Objekt, sagen Sie es Länder der Namen, um die Zustände in jQuery mit einem Ajax-Aufruf wie folgt zu erreichen:

$('#Countries').change(function() { 
    var val = $(this).val(); 
    $states = $('#States'); 
    $.ajax({ 
     url: '<%= Url.Action('States') %>', 
     dataType: 'json', 
     data: { countryCode: val }, 
     success: function(states) { 
      $.each(states, function(i, state) { 
       $states.append('<option value="' + state.Abbr+ '">' + state.Name + '</option>'); 
      }); 
     }, 
     error: function() { 
      alert('Failed to retrieve states.'); 
     } 
    }); 
}); 

die Metros würden Drop-Down-analogisch gefüllt werden, Übergeben Sie sowohl die Länder- als auch die Länderauswahl an den Server d ein JSON-Objekt mit einem Array von Metro-Bereichen zurückbekommen.

Ich habe die Details der Repository-Implementierung weggelassen, füllen Sie einfach die Ergebnisvariable auf dem Server mit einer Sammlung von Staaten/Metropolregionen in irgendeiner Weise. Ich machte auch eine Annahme, dass die Staatsklasse zwei Eigenschaften haben würde - Abbr (z. B. "CA") und Name (z. B. Kalifornien).

Ich hoffe, dass es Ihnen in irgendeiner Weise hilft oder zumindest Sie irgendwie auf die Lösung hinweist.

+1

Vielen Dank, funktioniert auch für mich! musste ein Michel

+0

Oh, ich habe es nicht bemerkt! Danke, ich habe meine Antwort bearbeitet. –

+0

Eine Anmerkung, wenn ich nicht in 'json' analysiere und etwas wie 'Liste ' zurückschicke, muss ich 'states.d' verwenden, sonst sind die Eigenschaften immer undefiniert. – atconway