Select item in dropdown List and appears in table

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 for the solution for last 3 days but can't find it so kindly please help me

Controller File

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

View File

"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($(', { value: 0, text: "Select a Product" }));
$.each(classesData, function (index, itemData)
{
select.append($(', { value: itemData.Value, text: itemData.Text }));
});
});
});
});

2 Replies

Know the answer? Post it — somebody with the same question will find it here.

").append("");

$("#YourTable").append(trr);

});

Bro thankyousomuch <3
Singh is king

" + $("#dd_Company option:selected").text() + "

" + $("#ddProduct option:selected").text() + "