Tự động lùi lại trong danh sách thả xuống mvc

Question

Yêu cầu: Tôi có một danh sách thả xuống trên trang xem của tôi, hiển thị danh sách các nhà cung cấp. Khi một nhà cung cấp được chọn từ danh sách thả xuống, trang sẽ hiển thị chi tiết của nhà cung cấp được chọn. Theo mặc định, tôi cần phải giữ cho nhà cung cấp đầu tiên được chọn và các chi tiết của nó được hiển thị. Tôi có thể thực hiện điều này bằng cách sử dụng mã sau đây.

Sự cố: Không biết cách thực hiện autopostback = true trong MVC. Tôi cần hiển thị chi tiết của nhà cung cấp được chọn về việc chọn nhà cung cấp trong danh sách thả xuống.

Tôi đang sử dụng ASP.net 4.0, MVC3, Entity Framework 4.0. Đây là mã của tôi:

[AcceptVerbs("POST")] 
    public ActionResult SearchResult(FormCollection collection) 
    { 
     try 
     { 
      string vendorName = collection["searchItem"].ToString(); 

      vendorName = vendorName.Trim(); 
      List<Vendor> vendorList = Queries.compiledVendorQuery(dbContext, vendorName).ToList<Vendor>(); 

      if(vendorList.Count() == 0) 
       return View("EmptySearch"); 

      List<SelectListItem> vendorSelectList = new List<SelectListItem>(); 
      foreach (Vendor vendor in vendorList) 
      { 
       vendorSelectList.Add(new SelectListItem 
       { 
        Text = vendor.vendorName.ToString(), 
        Value = vendor.vendorId.ToString() 
       }); 
      } 

      Vendor selectedVendor = vendorList[0]; 

      VendorDetails vendorDeatils = Queries.compiledVendorDetailsQuery(dbContext, selectedVendor.vendorId.ToString()).FirstOrDefault(); 

      VendorResult vendorResult = new VendorResult(); 

      vendorResult.vendorSelectList = vendorSelectList; 
      vendorResult.vendorDetails = vendorDeatils; 

      return View(vendorResult); 
     } 
     catch (Exception e) 
     { 
      return View("EmptySearch"); 
     } 
    } 


public class VendorResult 
{ 
    public List<SelectListItem> vendorSelectList { get; set; } 
    public VendorDetails vendorDetails {get; set;} 
} 


public class VendorDetails 
{ 
    public string vendorId { get; set; } 
    public string vendorName { get; set; } 
    public string address1 { get; set; } 
    public string address2 { get; set; } 
    public string address3 { get; set; } 
    public string city { get; set; } 
    public string state { get; set; } 
    public string zip { get; set; } 
    public decimal noteIndex { get; set; } 
    public string comment1 { get; set; } 
    public string comment2 { get; set; } 
    public string phone { get; set; } 
    public string interPhone { get; set; } 
    public string fax { get; set; } 
    public string interFax { get; set; } 
} 

Chỉnh sửa: Mã xác định danh sách thả xuống của tôi.

@model KeleTools.Models.VendorResult 

@{ 
    ViewBag.Title = "Vendor LookUp Tool"; 
    Layout = "~/Views/Shared/_ResultLayout.cshtml"; 
} 

<h2>Vendor Details</h2> 

<p> Select a vendor to display details:</p> 

@Html.DropDownList("VendorList", @Model.vendorSelectList, null, new {target="_self"}) 

@using (Html.BeginForm("SearchResult", "VendorLookUp")) 
{ 
    <div class="margin-10-top" > 
    <table id= "OrderDetail" class="OrderDetail"> 
    <tr class="OrderDetail"> 
     <td class="PropertyName">Vendor Id:</td> 
     <td class="PropertyValue">@Model.vendorDetails.vendorId.ToString().Trim()</td> 
    </tr> 
    <tr class="OrderDetail"> 
     <td class="PropertyName">Vendor Name:</td> 
     <td class="PropertyValue">@Model.vendorDetails.vendorName.ToString().Trim()</td> 
    </tr> 
    @{ 
          string address = @Model.vendorDetails.address1.ToString().Trim(); 
          address = address + "\n"; 
          address = address + @Model.vendorDetails.address2.ToString().Trim(); 
          address = address + "\n"; 
          address = address + @Model.vendorDetails.address3.ToString().Trim(); 

     <tr class="OrderDetail"> 
      <td class="PropertyName">Address</td> 
      <td class="PropertyValue">@address.TrimEnd()</td> 
     </tr> 
    } 
    @{ 
           string city = @Model.vendorDetails.city.ToString().TrimEnd(); 
           city = city + ", "; 
           city = city + @Model.vendorDetails.state.ToString().Trim(); 
           city = city + " "; 
           city = city + @Model.vendorDetails.zip.ToString().Trim(); 

     <tr class="OrderDetail"> 
      <td class="PropertyName">&nbsp;</td> 
      <td class="PropertyValue">@city</td> 
     </tr> 

           string phoneNumber = null; 
           if (!string.IsNullOrEmpty(@Model.vendorDetails.phone.ToString().Trim())) 
           { 
            phoneNumber = @Model.vendorDetails.phone.ToString().TrimEnd().Substring(0, 3); 
            phoneNumber = phoneNumber + "-"; 
            phoneNumber = phoneNumber + @Model.vendorDetails.phone.ToString().TrimEnd().Substring(3, 3); 
            phoneNumber = phoneNumber + "-"; 
            phoneNumber = phoneNumber + @Model.vendorDetails.phone.ToString().TrimEnd().Substring(6, 4); 
            if (@Model.vendorDetails.phone.ToString().Trim().Length > 10) 
            { 
             phoneNumber = phoneNumber + " Ext: "; 
             phoneNumber = phoneNumber + @Model.vendorDetails.phone.ToString().TrimEnd().Substring(10); 
            } 
           } 

     <tr class="OrderDetail"> 
      <td class="PropertyName">Phone Number:</td> 
      <td class="PropertyValue">@phoneNumber</td> 
     </tr> 
           phoneNumber = null; 
           if (!string.IsNullOrEmpty(@Model.vendorDetails.fax.ToString().Trim())) 
           { 
            phoneNumber = @Model.vendorDetails.fax.ToString().TrimEnd().Substring(0, 3); 
            phoneNumber = phoneNumber + "-"; 
            phoneNumber = phoneNumber + @Model.vendorDetails.fax.ToString().TrimEnd().Substring(3, 3); 
            phoneNumber = phoneNumber + "-"; 
            phoneNumber = phoneNumber + @Model.vendorDetails.fax.ToString().TrimEnd().Substring(6, 4); 
            if (@Model.vendorDetails.fax.ToString().Trim().Length > 10) 
            { 
             phoneNumber = phoneNumber + " Ext: "; 
             phoneNumber = phoneNumber + @Model.vendorDetails.fax.ToString().TrimEnd().Substring(10); 
            } 
           } 

     <tr class="OrderDetail"> 
      <td class="PropertyName">Fax:</td> 
      <td class="PropertyValue">@phoneNumber</td> 
     </tr> 
           phoneNumber = null; 
           if (!string.IsNullOrEmpty(@Model.vendorDetails.interPhone.ToString().Trim())) 
           { 

            phoneNumber = @Model.vendorDetails.interPhone.ToString().TrimEnd().Substring(0, 3); 
            phoneNumber = phoneNumber + "-"; 
            phoneNumber = phoneNumber + @Model.vendorDetails.interPhone.ToString().TrimEnd().Substring(3, 3); 
            phoneNumber = phoneNumber + "-"; 
            phoneNumber = phoneNumber + @Model.vendorDetails.interPhone.ToString().TrimEnd().Substring(6, 4); 
            if (@Model.vendorDetails.interPhone.ToString().Trim().Length > 10) 
            { 
             phoneNumber = phoneNumber + " Ext: "; 
             phoneNumber = phoneNumber + @Model.vendorDetails.interPhone.ToString().TrimEnd().Substring(10); 
            } 
           } 

     <tr class="OrderDetail"> 
      <td class="PropertyName">International Phone:</td> 
      <td class="PropertyValue">@phoneNumber</td> 
     </tr> 
           phoneNumber = null; 
           if (!string.IsNullOrEmpty(@Model.vendorDetails.interFax.ToString().Trim())) 
           { 
            phoneNumber = @Model.vendorDetails.interFax.ToString().TrimEnd().Substring(0, 3); 
            phoneNumber = phoneNumber + "-"; 
            phoneNumber = phoneNumber + @Model.vendorDetails.interFax.ToString().TrimEnd().Substring(3, 3); 
            phoneNumber = phoneNumber + "-"; 
            phoneNumber = phoneNumber + @Model.vendorDetails.interFax.ToString().TrimEnd().Substring(6, 4); 
            if (@Model.vendorDetails.interFax.ToString().Trim().Length > 10) 
            { 
             phoneNumber = phoneNumber + " Ext: "; 
             phoneNumber = phoneNumber + @Model.vendorDetails.interFax.ToString().TrimEnd().Substring(10); 
            } 
           } 

     <tr class="OrderDetail"> 
      <td class="PropertyName">International Fax:</td> 
      <td class="PropertyValue">@phoneNumber</td> 
     </tr> 
     } 
     <tr class="OrderDetail"> 
     <td class="PropertyName">Comment 1:</td> 
     <td class="PropertyValue">@Model.vendorDetails.comment1.ToString().TrimEnd() < /td> 
    < /tr> 
    <tr class="OrderDetail"> 
     <td class="PropertyName">Comment 2:</td> 
     <td class="PropertyValue">@Model.vendorDetails.comment2.ToString().Trim()</td> 
    < /tr> 

< /table> 
< /div> 
} 

Answer 1

Không có AutoPostback=true trong MVC. Bạn sẽ phải tự nối dây này. Bạn có thể làm một cái gì đó như thế này, sử dụng jQuery:

$("#idOfMyDropDownList").change(function() { 
    // Handle the change event, such as fire off an ajax request. 
}); 

Answer 2

Giả sử bạn sẽ cần phải làm một cơ sở dữ liệu đánh để có được những kết quả, bên trong chức năng jquery James D'Angelo'a sau đó bạn sẽ làm một .post vào nhà cung cấp phương pháp chi tiết trong bộ điều khiển của bạn để lấy đối tượng của bạn trở lại và sau đó bạn điền các chi tiết cho nhà cung cấp được chọn vào trang. Bạn sẽ có thêm một phương pháp để điều khiển tới đó trả về một đối tượng json

$.post("/{Controller}/{Method}", { VendorId: selectVal }, function(response, status) { 
    var vendorDetails = eval("(" + response + ")"); 
    //additional code to populate the fields 

Answer 3

Thay đổi thả xuống instantiation này

@Html.DropDownList("VendorList", @Model.vendorSelectList, new { onchange = "$(this).parent('form:first').submit();" }}) 

Answer 4

Bạn có thể làm điều đó bằng cách này:

@Html.DropDownList("VendorList", @Model.vendorSelectList, "--Select Vendor--", new { @onchange = "this.form.submit();" })