Hi All,
A few week I have tried it,finally I got solution as below:
Main View:
<p><b>CUSTOMER INFORMATION</b></p>
<div id="CustomerContainer">@Html.Action("CustomerView")</div>
Partial View:
<table>
<tr>
<td><label for="Customer">Customer</label></td>
<dd></dd>
<td>@Html.DropDownListFor(p => p.SelectedCustomerID, Model.CustomerIEnum, "Select Customer", new { @id = "Customer-DropdownID" })</td>
</tr>
<tr><div id="InChargeContainer">@Html.Action("CustomerDetailsView")</div></tr>
</table>
JQuery:
<script type="text/javascript">
$(document).ready(function () {
$("#Customer-DropdownID").bind("change", function () {
var ID = $(this).val();
$.ajax({
"type": "POST",
"url": "/Sales/CustDetails/",
"dataType": "json",
"data": {"customerID": ID},
"success": function (data) {
location.reload();
},
error: alert('Customer ID is' + ID),
});
});
});
</script>
Child Partial View:
<tr>
<td><label for="inCharge">Contact Person</label></td>
<td><dd>@Html.DisplayFor(model => model._selectedPIC)</dd></td>
</tr>
View Model:
public List<Model.Models.Customer> CustomerList = new List<Model.Models.Customer>();
public IEnumerable<SelectListItem> CustomerIEnum
{
get
{
return new SelectList(CustomerList, "CustomerID", "CustomerName");
}
}
public Int32 SelectedCustomerID { get; set; }
public string _selectedPIC { get; set; }
Controller:
public JsonResult CustDetails(int? customerID)
{
using (DBContext db = new DBContext(connection))
{
_custRepository = new GenericRepository<Customer>(db);
if (customerID != null)
{
IEnumerable<Customer> q = _custRepository.FindBy(p => p.CustomerID == customerID);
foreach (var item in q)
{
Customer obj = new Customer();
obj.CustomerID = item.CustomerID;
obj.InCharge = item.InCharge;
customervm.SelectedCustomerID = obj.CustomerID;
customervm._selectedPIC = obj.InCharge;
customervm.CustomerList.Add(obj);
}
}
}
return Json (customervm);
}