asp.net mvc - Autopost en la lista desplegable de mvc

asp.net-mvc asp.net-mvc-3

Question

Requerimiento: tengo una lista desplegable en mi página de vista, que muestra una lista de proveedores. Cuando se selecciona un proveedor del menú desplegable, la página muestra los detalles del proveedor seleccionado. De manera predeterminada, necesito mantener seleccionado al primer vendedor y mostrar sus detalles. Podría lograr esto usando el siguiente código.

Problema: No sé cómo lograr autopostback = verdadero en MVC. Necesito mostrar los detalles del proveedor seleccionado en la selección del proveedor en la lista desplegable.

Estoy usando ASP.net 4.0, MVC3, Entity Framework 4.0. Aquí está mi código:

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

Editar: Código que define mi lista desplegable.

@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

Asumiendo que necesitarás hacer un acierto en la base de datos para obtener los resultados, dentro de la función de jquery de James D''Angelo puedes hacer un .post en el método de detalles del proveedor en tu controlador para recuperar tu objeto y luego llenar los detalles para el proveedor seleccionado a la página. Deberá agregar un método al controlador que devuelve un objeto json

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

Answer 2

No hay AutoPostback=true en MVC. Tendrá que conectar esto usted mismo. Puedes hacer algo como esto, usando jQuery:

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

Answer 3

Cambiar la instanciación desplegable a este

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

Answer 4

Puedes hacerlo de esta manera:

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