BOLETC/js/conciertos.js

43 lines
1.7 KiB
JavaScript

document.addEventListener("DOMContentLoaded", function() {
fetch("../php/conciertos.php")
.then(response => response.json())
.then(data => {
let div = document.getElementById("conciertos");
div.innerHTML = ""; // Limpiar contenido previo
if (data.length === 0) {
div.innerHTML = "<p>No hay conciertos disponibles.</p>";
return;
}
data.forEach(concierto => {
let evento = document.createElement("div");
evento.classList.add("concierto");
evento.innerHTML = `
<img src="../img/${concierto.imagen}" alt="${concierto.nombre}" onerror="this.src='../img/default.jpg';">
<h2>${concierto.nombre}</h2>
<p><strong>Artista:</strong> ${concierto.artista}</p>
<p><strong>Ubicación:</strong> ${concierto.direccion}</p>
<p><strong>Fecha:</strong> ${concierto.fecha} - ${concierto.hora}</p>
<button onclick="comprarBoletos(${concierto.id})">COMPRAR</button>
`;
div.appendChild(evento);
});
configurarScroll();
})
.catch(error => console.error("Error cargando conciertos:", error));
});
// Función para redirigir a la compra de boletos
function comprarBoletos(conciertoId) {
window.location.href = `venta_boletos.html?concierto_id=${conciertoId}`;
}
// Configurar la barra de desplazamiento
function configurarScroll() {
const container = document.getElementById("conciertos");
container.style.overflowX = "auto"; // Habilitar desplazamiento horizontal
container.style.whiteSpace = "nowrap"; // Asegurar que los elementos estén en línea
}