I've made two dropdown lists "Company" And "Product".
When I select the company, all its products appear in Product Dropdown list.
Now I want to do another work. If i select Company and product it will appear on below table list using jquery.
i was searching the solution for last 3 days but can't find it so kindly please help me.
<script type="text/javascript">
$(document).ready(function () {
$("#dd_Company").change(function () {
var CompanyId = $(this).val();
// var d = $("#dd_Company").val($(this).text());
var txt = $("#dd_Company option:selected").text();
$("#span1").text(txt);
$.getJSON("../UserLogin/LoadProductsByCompanyId", { CompanyId: CompanyId, cn: txt },
function (classesData) {
var select = $("#ddProduct");
select.empty();
select.append($('<option/>', {
value: 0,
text: "Select a Product"
}));
$.each(classesData, function (index, itemData) {
select.append($('<option/>', {
value: itemData.Value,
text: itemData.Text
}));
});
});
});
});
</script>
<table>
<tr>
[Authorize]
[AllowAnonymous]
public ActionResult Details()
{
ViewBag.Companies = db.Companies.ToList();
return View();
}
private IList<Product> GetProduct(int CompanyId)
{
var data = db.Products.Where(m => m.CompanyId == CompanyId).ToList();
return data;
}
[AcceptVerbs(HttpVerbs.Get)]
public JsonResult LoadProductsByCompanyId(string CompanyId, string cn)
{
Cname = cn;
var ProductList = this.GetProduct(Convert.ToInt32(CompanyId));
var ProductsData = ProductList.Select(m => new SelectListItem()
{
Text = m.ProductName,
Value = m.ProductId.ToString()
});
return Json(ProductsData, JsonRequestBehavior.AllowGet);
}