I working on E-commerce Laptop. So I want when the user choose another color in selected box it will direct to the product of that color example website. So I using JavaScript to direct url, here the code
$(document).on('change', '#color', function () {
var selectedRam = $('#@Model.RamId').val();
var selectedSSD = $('#@Model.Ssdid').val();
var selectedColor = $(this).val();
var url = '@Url.Action("ProductDetail", "ProductView", new { id = "selectedColor", ramId = "selectedRam", ssdId = "selectedSSD" })';
window.location.href = url;
});
The controller :
public async Task<IActionResult> ProductDetail(int? id, int ramId, int ssdId)
{
if (id == null)
{
return BadRequest();
}
var sp = await _context.ProductVariations
.Include(n => n.ProductItems.Product)
.Where(n => n.ProductItemsId == id && n.RamId == ramId && n.Ssdid == ssdId)
.FirstOrDefaultAsync();
ViewBag.Lisp = _context.ProductItems
.Include(n => n.Product.Category)
.Where(n => n.Product.CategoryId == sp.ProductItems.Product.CategoryId);
ViewBag.Color = await _context.ProductItems
.Where(n => n.ProductId == sp.ProductItems.ProductId)
.Include(n => n.Color)
.ToListAsync();
if (sp == null)
{
return NotFound();
}
return View(sp);
}
The value of color in selected box is productItemsId color options. So when I got the productItemsId, SsdId and RamId i will find the product of that color in productVariation table in database. But the problem is when I choose another color its doesn’t work. I belevied my javacripts was wrong. I searching chat gpt and copilot but still the same. Does any one know solution. I will appreciated any instruction. Thank you