87 lines
3.6 KiB
Plaintext
87 lines
3.6 KiB
Plaintext
@model WebVentaCoche.Models.Product
|
|
|
|
<div class="container">
|
|
<h2 class="text-center my-4">@Model.Name</h2>
|
|
|
|
<div class="row">
|
|
<div class="col-12 mb-4">
|
|
<div class="card" style="background-color: rgba(255, 255, 255, 0.8); border-radius: 10px;">
|
|
<div class="row g-0">
|
|
<div class="col-md-8">
|
|
<div class="card-body">
|
|
<p>@Model.LongDescription</p>
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<p><strong>Precio:</strong> @Model.Price €</p>
|
|
<!-- Formulario sin "submit" tradicional -->
|
|
<form id="addToCartForm">
|
|
<input type="hidden" name="id" value="@Model.Id" />
|
|
<button type="submit" class="btn btn-primary">Añadir al carrito</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4 d-flex align-items-center">
|
|
@if (!string.IsNullOrEmpty(Model.ImagePath))
|
|
{
|
|
<img src="@Model.ImagePath" class="img-fluid rounded m-3" alt="@Model.Name" />
|
|
}
|
|
else
|
|
{
|
|
<img src="/images/default.png" class="img-fluid rounded m-3" alt="Imagen no disponible" />
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@section Scripts {
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", function () {
|
|
const form = document.getElementById("addToCartForm");
|
|
form.addEventListener("submit", function (event) {
|
|
event.preventDefault();
|
|
|
|
let url = '@Url.Action("AddProductToCart", "Cart")';
|
|
let formData = new FormData(form);
|
|
|
|
fetch(url, {
|
|
method: 'POST',
|
|
body: formData
|
|
})
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error("Error en la respuesta del servidor");
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(data => {
|
|
if (data.success) {
|
|
// Mensaje opcional
|
|
alert("¡Producto añadido al carrito!");
|
|
|
|
// 1) Obtener el span (o elemento) que muestra el contador
|
|
// Por ejemplo, un <span> con id="cartCountSpan".
|
|
const badgeElement = document.getElementById("cartCountSpan");
|
|
|
|
// 2) Actualizar el contenido del badge
|
|
badgeElement.innerText = data.cartCount;
|
|
|
|
// 3) Mostrarlo si está oculto (si data.cartCount > 0)
|
|
if (data.cartCount > 0) {
|
|
badgeElement.parentElement.classList.remove("d-none");
|
|
// Asumiendo que envuelves el badge en un contenedor con "d-none" cuando es 0
|
|
}
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error(error);
|
|
alert("Ocurrió un error al añadir el producto al carrito.");
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
}
|
|
|