2009-10-18 48 views
8

Tôi có 3 danh sách thả xuống cho Quốc gia, Tiểu bang và Metro. Tôi muốn khi người dùng seclect Nước sau đó Nhà nước DropDownList điền Jquery và khi chọn Nhà nước sau đó Metro DropDownList lấp đầy (như tầng DropDownList của ajax) quá trình .These tôi muốn làm gì với JQuery.Ràng buộc danh sách thả xuống với JQuery trong Asp.Net

Trả lời

10

Tôi sẽ mô tả nó trong ASP.NET MVC, nhưng cũng có thể đạt được nếu bạn viết một dịch vụ web ASP.NET hoặc chỉ cần đặt một vài phương pháp trang trong mã của bạn phía sau để làm tương tự - bạn ' cũng sẽ cần một serializer JSON, hoặc là một giải pháp của bên thứ 3 hoặc một trong WCF.

Sử dụng MVC, đầu tiên, chúng ta hãy có ba hành động điều khiển - một để hiển thị trang, các nước sẽ tĩnh, và hai để có được các bang và thành phố lớn tương ứng:

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); 
} 

Trong giao diện, bạn có ba dropdownlists, một là ràng buộc để ViewData [ "Quốc gia"] đối tượng, nói nó được đặt tên quốc gia, bạn có thể nhận được các bang trong jQuery với một cuộc gọi Ajax như thế này:

$('#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.'); 
     } 
    }); 
}); 

các thành phố lớn thả xuống sẽ được lấp đầy loại suy, chuyển cả lựa chọn quốc gia và tiểu bang đến máy chủ d lấy lại một đối tượng JSON với một mảng các khu vực đô thị.

Tôi đã bỏ qua chi tiết triển khai kho lưu trữ, chỉ cần điền vào biến kết quả trên máy chủ với tập hợp các tiểu bang/khu vực đô thị theo một cách nào đó. Tôi cũng giả định rằng lớp Nhà nước sẽ có hai thuộc tính - Abbr (ví dụ: 'CA') và Tên (ví dụ: California).

Tôi hy vọng rằng nó giúp bạn theo bất kỳ cách nào hoặc ít nhất là hướng bạn bằng cách nào đó hướng tới giải pháp.

+1

cảm ơn rất nhiều, cũng làm việc cho tôi! đã phải đặt <ở phía trước giá trị tùy chọn .... – Michel

+0

Ồ, tôi không nhận thấy điều đó! Cảm ơn, tôi đã chỉnh sửa câu trả lời của mình. –

+0

Một lưu ý, nếu không phân tích cú pháp thành 'json' và trả về một cái gì đó như' Danh sách ', tôi phải sử dụng' states.d' hoặc các thuộc tính khác luôn không xác định. – atconway

Các vấn đề liên quan