<link href="https://storage.googleapis.com/mdc-website/mdc-assets/css/summercamps-courses.course.playground.css?v4" rel="stylesheet" type="text/css"/><link href="https://fonts.googleapis.com" rel="preconnect"/><link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/><link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap" rel="stylesheet"/><div class="geeks"><nav aria-label="breadcrumb" class="d-none d-md-block" id="breadcrumb"><ol class="breadcrumb background-gray mb-0"><div class="container d-flex flex-row"><li class="breadcrumb-item"><a class="txt-dark bold-700" href="https://ce.mdc.edu"><strong> Home </strong></a></li><li class="breadcrumb-item"><a class="txt-dark bold-500" href="https://ce.mdc.edu/contentManagement.do?method=load&code=CM000022"> Summer Camps </a></li><li aria-current="page" class="breadcrumb-item active"> Jazz Explorers Camp </li></div></ol></nav><div class="bg-navbar-summer position-relative" id="navbar_summer"><div class="d-flex justify-content-center align-items-center"><img class="img-fluid my-3 navbar-summer-image" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/summer-logo.svg"/></div><div class="position-absolute text-center nav-summer-bleed"><div class="row justify-content-center mx-3"><div class="col-8 col-md-12 locations-summer"><a class="text-black m-0 link-summer" href="https://ce.mdc.edu/public/category/programStream.do?method=load&selectedProgramAreaId=3519128&selectedProgramStreamId=3519238">Hialeah</a><a class="text-black m-0 link-summer" href="https://ce.mdc.edu/public/category/programStream.do?method=load&selectedProgramAreaId=3519128&selectedProgramStreamId=3519257">Homestead</a><a class="text-black m-0 link-summer" href="https://ce.mdc.edu/public/category/programStream.do?method=load&selectedProgramAreaId=3519128&selectedProgramStreamId=3519272">Kendall</a><a class="text-black m-0 link-summer" href="https://ce.mdc.edu/public/category/programStream.do?method=load&selectedProgramAreaId=3519128&selectedProgramStreamId=3519305">Medical</a><a class="text-black m-0 link-summer" href="https://ce.mdc.edu/public/category/programStream.do?method=load&selectedProgramAreaId=3519128&selectedProgramStreamId=3519309">North</a><a class="text-black m-0 link-summer" href="https://ce.mdc.edu/public/category/programStream.do?method=load&selectedProgramAreaId=3519128&selectedProgramStreamId=3519450">Padron</a><a class="text-black m-0 link-summer" href="https://ce.mdc.edu/public/category/programStream.do?method=load&selectedProgramAreaId=3519128&selectedProgramStreamId=3519387">West</a><a class="text-black m-0 link-summer" href="https://ce.mdc.edu/public/category/programStream.do?method=load&selectedProgramAreaId=3519128&selectedProgramStreamId=3519341">Wolfson</a></div></div></div></div><script>
document.addEventListener('DOMContentLoaded', function () {
// Obtener la URL actual incluyendo los parámetros de búsqueda
let currentPath = window.location.pathname + window.location.search;
// Obtener todos los enlaces de summer
let summerLinks = document.querySelectorAll('.link-summer');
// Recorrer los enlaces para encontrar coincidencias y establecer la clase active
summerLinks.forEach(function (link) {
let linkPath = new URL(link.href).pathname + new URL(link.href).search;
if (currentPath === linkPath) {
link.classList.add('active'); // Añadir clase 'active'
}
});
});
</script><div class="background-linear-bottom-light-blue" id="hero_one_image"><div class="container"><div class="mb-0 mb-md-3"><div class="row px-4 px-md-0 vector one_image flex-column-reverse flex-md-row mb-3"><!-- Columna con contenido principal --><div class="col-md-6 px-2 px-md-5 mobile-background mt-4"><div class="d-flex flex-column mb-0 mb-md-5"><h1 class="text-center text-md-left mb-0"> Unleash your inner jazz <strong class="bold-700">virtuoso</strong> at Jazz Explorers! </h1><p class="txt-sm txt-gray d-md-block bold-500"> This electrifying one-week camp is your ticket to mastering the art of jazz, whether you're a budding improviser or already grooving to the rhythm. </p><div class="d-flex justify-content-center justify-content-md-start py-4"><a class="button button-primary mt-4 mb-0 mb-md-4" href="#" onclick="scrollToComponent(event, '#price_cards_section')"> Enroll today! </a></div></div></div><!-- Columna derecha --><div class="col-md-6 p-0 d-flex justify-content-center align-items-end mobile-background"><img alt="" class="pt-5 pt-md-0 w-100" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/image-container-10.png"/></div></div></div></div></div><!-- Video content --><div class="container pt-0 px-0 py-5" id="left_video_bicolor"><div class="d-flex justify-content-center flex-column flex-md-row px-4 px-md-0 w-100"><div class="col-md-6 content-video left px-0 order-1 order-md-1 w-100 justify-content-center align-items-center"><img alt="" class="img-fluid ml-md-0" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/image-13.png"/></div><div class="col-md-7 order-2 order-md-2 w-100 px-0"><div class="bicolor-one"><header class="bicolor-responsive"><h2 class="py-3"> About Jazz Explorers Camp for Teen Musicians </h2><hr class="geeks-hr"/><ul class="d-flex flex-column justify-content-center w-100 p-0 mb-0"><li class="d-flex align-items-center justify-content-between mt-2"> Ready to groove with fellow jazz lovers? Join us at this innovative one-week camp where you'll get to explore jazz playing, improvisation, and jazz theory with fellow teen musicians. Whether you're new to jazz or have some experience under your belt, this camp will help you expand your skills, boost your creativity, and learn the building blocks of jazz theory. </li><li class="d-flex align-items-center justify-content-between mt-2"> Bring your instrument to life while building social skills like teamwork, communication, and confidence. Get a taste of jazz arranging, learning how to create music that reflects your unique style. </li></ul></header></div><div class="bicolor-two"><article class="bicolor-responsive"><ul class="d-flex flex-column justify-content-center w-100 p-0"><li class="d-flex align-items-center justify-content-between mt-2 dashed-gray"><span class="d-flex align-items-center"><img alt="" class="mr-2" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/bank.svg"/><span class="item-text txt-sm"><span class="bold-600">Dates: </span><span class="bold-300">7/14 to 7/18, 2025</span></span></span></li><li class="d-flex align-items-center justify-content-between mt-2 dashed-gray"><span class="d-flex align-items-center"><img alt="" class="mr-2" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/alarm.svg"/><span class="item-text txt-sm"><span class="bold-600">Classes: </span><span class="bold-300">9:00 A.M. to 3:00 P.M.</span></span></span></li><li class="d-flex align-items-center justify-content-between mt-2 dashed-gray"><span class="d-flex align-items-center"><img alt="" class="mr-2" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/user.svg"/><span class="item-text txt-sm"><span class="bold-600">Age: </span><span class="bold-300">14 to 17 years old</span></span></span></li><li class="d-flex align-items-center justify-content-between mt-2 dashed-gray"><span class="d-flex align-items-center"><img alt="" class="mr-2" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/pin.svg"/><span class="item-text txt-sm"><span class="bold-600">Location: </span><span class="bold-300">Wolfson Campus</span></span></span></li></ul></article></div></div></div></div><!-- Script integrado para el video de esta macro --><script>
document.addEventListener("DOMContentLoaded", function () {
let playImage = document.getElementById("play-image");
if (playImage) {
playImage.style.cursor = "pointer";
playImage.addEventListener("click", function (e) {
e.preventDefault();
let videoUrl = playImage.dataset.videourl;
let embedHtml = `
<div class="col-12 d-flex justify-content-center align-items-center px-0 video-container">
<iframe
class="youtube_embed"
src="${videoUrl}?autoplay=1&controls=1&modestbranding=1&rel=0&showinfo=0"
frameborder="0"
allow="autoplay; encrypted-media"
allowfullscreen>
</iframe>
</div>`;
playImage.closest(".content-video").innerHTML = embedHtml;
});
}
});
</script><div class="background-linear-light"><div class="container px-4 px-md-0" id="price_cards_section"><div class="d-flex flex-column"><header class="text-center d-flex flex-column align-items-center pb-4 mt-5"><h2>Enroll in <br/> Jazz Explorers Camp for Teen Musicians</h2><hr class="geeks-hr"/><p class="txt-gray txt-s"> Discover courses by filtering by date and age group. </p></header><div class="pb-0 pb-md-5"><!-- Dropdowns con opción de filtrado --><div class="d-flex flex-column flex-md-row justify-content-center align-items-center pb-5"><div class="dropdown mr-0 mr-md-3 mb-3 mb-md-0 card-empty"><div aria-expanded="false" aria-haspopup="true" class="btn d-flex justify-content-between align-items-center dropdown-toggle w-100 h-100" data-toggle="dropdown" id="locationDropdown" type="button"><div class="d-flex flex-column align-items-start w-100 h-100 txt-xs">Location <div class="txt-sm text-black" id="locationDefault"> Kendall Campus</div></div><i class="fas fa-chevron-down ml-2"></i></div><div aria-labelledby="locationDropdown" class="dropdown-menu" id="locationOptions"></div></div><div class="dropdown card-empty"><div aria-expanded="false" aria-haspopup="true" class="btn d-flex justify-content-between align-items-center dropdown-toggle w-100 h-100" data-toggle="dropdown" id="dateDropdown" type="button"><div class="d-flex flex-column align-items-start w-100 h-100 txt-xs">Date <div class="txt-sm text-black" id="dateDefault">Oct 28, 2024</div></div><i class="fas fa-chevron-down ml-2"></i></div><div aria-labelledby="dateDropdown" class="dropdown-menu" id="dateOptions"></div></div></div><!-- Contenedor de las cards --><div class="row pt-4 accordion d-flex justify-content-center flex-column flex-md-row align-items-center" id="mdc-enroll-box"><template id="card-template"><div class="col-md-4 mb-4 card-wrapper"><div class="card card-enroll-blue" data-date="" data-location=""><div class="card-body p-0"><div class="p-3 card-head"><div class="d-flex justify-content-center align-items-center flex-column"><div class="row mini-stamp-white mb-2"><div class="bg-white enroll-icon-bg"><img alt="" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/calendar.svg" style="width: 13px"/></div><span class="course-date"></span></div><div class="row mini-stamp-white"><div class="bg-white enroll-icon-bg"><img alt="" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/pin.svg" style="width: 15px"/></div><span class="course-location"></span></div><p class="bold-600 txt-lg course-fees"></p><button class="button button-primary my-3 add_to_cart" style="width: 90%"> Add to cart </button></div><div class="course-details"><p class="txt-s bold-400 p-0"><span class="bold-600">Course name:</span><span class="section-title"></span></p><p class="txt-s bold-400 p-0"><span class="bold-600">Course number:</span><span class="display-id"></span></p><p class="txt-s bold-400 p-0"><span class="bold-600">Schedule:</span><span class="schedule-days"></span></p><p class="txt-s bold-400 p-0"><span class="bold-600">Class time:</span><span class="schedule-time"></span></p><p class="txt-s bold-400 p-0"><span class="bold-600">Duration:</span><span class="schedule-dates"></span></p></div></div><!-- Contenido colapsable con ID único --><div class="collapse px-3 pb-2 custom-border-top bg-white"><p class="txt-s bold-400"><span class="bold-600">Days:</span><a class="underline view-details-link" href="#"></a></p><p class="txt-s bold-400"><span class="bold-600">Course duration:</span><span class="course-duration"></span></p><p class="txt-s bold-400"><span class="bold-600">Delivery options:</span><a class="underline delivery-options-link" href="#"></a></p></div><!-- Botón "More/Less" con data-target que apunta al ID único --><div class="shopping-cart-wrap text-center d-flex align-items-center justify-content-center custom-border-top bg-white"><button aria-expanded="false" class="btn btn-link toggle-collapse-text d-flex" data-toggle="collapse" type="button"> More <div class="wrap-collapse-enroll ml-2"><i class="fas fa-chevron-down enroll_icon"></i></div></button></div></div></div></div></template></div><!-- Botón "Load more" para mostrar/ocultar tarjetas adicionales --><div class="text-center mt-4" id="load-more-container" style="display: none;"><p class="txt-s mb-2 txt-gray"> There are more available courses</p><button class="button button-outline" id="loadMoreBtn">Load more dates</button></div></div></div></div></div><script>
document.addEventListener('DOMContentLoaded', function() {
// Función para gestionar la visibilidad de las tarjetas
function manageCardVisibility() {
const cards = document.querySelectorAll('#mdc-enroll-box .card-wrapper');
const maxVisibleCards = 3;
const loadMoreContainer = document.getElementById('load-more-container');
const loadMoreBtn = document.getElementById('loadMoreBtn');
if (cards.length > maxVisibleCards) {
// Mostrar el contenedor de "Load more"
loadMoreContainer.style.display = 'block';
// Ocultar las tarjetas adicionales inicialmente
cards.forEach((card, index) => {
if (index >= maxVisibleCards) {
card.style.display = 'none';
card.classList.add('hidden-card');
}
});
// Configurar el comportamiento del botón
loadMoreBtn.addEventListener('click', function() {
const hiddenCards = document.querySelectorAll('.hidden-card');
const isExpanded = this.textContent.includes('See less');
hiddenCards.forEach(card => {
card.style.display = isExpanded ? 'none' : 'block';
// Aplicar animación a las tarjetas que se muestran
if (!isExpanded) {
card.classList.add('fade-in');
setTimeout(() => {
card.classList.remove('fade-in');
}, 1000);
}
});
// Cambiar el texto del botón
this.textContent = isExpanded ? 'Load more dates' : 'See less';
});
}
}
// Ejecutar la función inmediatamente ya que ahora tenemos las cards estáticas
manageCardVisibility();
});
</script><link href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.13/css/intlTelInput.css" rel="stylesheet"/><div class="container px-4 px-md-0 py-5 d-none" id="waiting_list_form"><div class="card-shadow"><div class="row card-hero background-ellipse-v2 p-2 p-md-4"><div class="col-md-6 d-flex flex-column justify-content-center"><h2 class="text-center text-md-left mb-3"> Get notified when it becomes available </h2><p class="txt-gray txt-s mb-2 d-none d-md-block"> We are about to create some dates and availability for this course, give us your contact information and we will notify you once we are accepting enrollments. </p><!-- Iconos info de versión Desktop --><div class="d-none d-md-block"><ul class="list-group"><!-- Static details can be added here if needed --></ul></div></div><div class="col-md-6 d-flex align-items-center"><form class="form needs-validation d-flex flex-column align-items-center w-100" data-slug="jazz-explorers" id="form-waiting_list_form" novalidate=""><div class="row w-l-responsive"><div class="form-group stamp stamp-md-gray text-left mr-3 col"><label class="mb-0 txt-xs" for="name">Name</label><input class="form-control stamp-empty" id="name" name="name" placeholder="Your name" required="" type="text"/><div class="invalid-feedback">Please enter your name.</div></div><div class="form-group stamp stamp-md-gray text-left col"><label class="mb-0 txt-xs" for="lastName">Last name</label><input class="form-control stamp-empty" id="lastName" name="lastName" placeholder="Your last name" required="" type="text"/><div class="invalid-feedback">Please enter your last name.</div></div></div><div class="form-group stamp stamp-md-gray text-left"><input class="form-control stamp-empty" id="phone" name="phone" placeholder="Phone number" required="" type="tel"/><div class="invalid-feedback" id="phoneError">Please enter your phone number.</div><div class="invalid-feedback" id="countryError">The phone number does not match the selected country.</div></div><div class="form-group stamp stamp-md-gray text-left"><label class="mb-0 txt-xs" for="email">Email</label><input class="form-control stamp-empty" id="email" name="email" placeholder="Your email address" required="" type="email"/><div class="invalid-feedback">Please enter a valid email.</div></div><!-- Program selection removed as we're using static data --><div class="form-group stamp stamp-md-gray text-left" id="location-group"><label class="mb-0 txt-xs" for="campuses">Select a campus of preference</label><select class="form-control stamp-empty txt-muted" id="campuses" name="campuses" required=""><option class="txt-gray" disabled="" selected="" value="">Select a location</option><option data-locations="padron" value="padron">Padron Campus</option></select><div class="invalid-feedback">Please select a campus</div></div><!-- Alertas de error y éxito --><div class="alert alert-danger d-none">Error!</div><div class="alert alert-success d-none w-75"> Thank you for submitting your request. Our admissions team will contact you soon. </div><button class="button button-primary w-l-responsive leads-btn mb-3" type="submit"> Submit form </button></form></div></div></div></div><script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.13/js/intlTelInput.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.13/js/utils.js"></script><script>
document.addEventListener("DOMContentLoaded", function () {
const form = document.querySelector(`#form-waiting_list_form`);
if (!form) {
console.error('Form not found');
return;
}
const phoneInput = form.querySelector('#phone');
const phoneError = form.querySelector('#phoneError');
const countryError = form.querySelector('#countryError');
const locationGroup = form.querySelector('#location-group');
const campusesSelect = form.querySelector('#campuses');
const programsSelect = form.querySelector('#programs');
const iti = window.intlTelInput(phoneInput, {
utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.13/js/utils.js"
});
// Filtrar caracteres no numéricos en el campo de teléfono
phoneInput.addEventListener('input', function () {
phoneInput.value = phoneInput.value.replace(/\D/g, '');
});
if (campusesSelect.options.length === 2) {
campusesSelect.selectedIndex = 1;
locationGroup.style.display = 'none';
}
form.addEventListener('submit', function (event) {
event.preventDefault();
event.stopPropagation();
phoneError.style.display = 'none';
countryError.style.display = 'none';
if (form.checkValidity() === false || !iti.isValidNumber()) {
form.classList.add('was-validated');
if (!phoneInput.value) {
phoneError.style.display = 'block';
} else if (!iti.isValidNumber()) {
countryError.style.display = 'block';
}
return;
}
const formData = new FormData(form);
// Usar el slug del formulario
const selectedProgram = form.getAttribute('data-slug');
const data = {
first_name: formData.get("name"),
last_name: formData.get("lastName"),
email: formData.get("email"),
phone: iti.getNumber(),
programs: selectedProgram,
locations: formData.get("campuses") || (campusesSelect.options.length > 1 ? campusesSelect.options[1].value : "padron"),
additional_info: "Waiting list",
...loadSessionData()
};
// La fecha se manejará en el backend
data.created_at = new Date().toISOString();
const alertError = form.querySelector('.alert.alert-danger');
const alertSuccess = form.querySelector('.alert.alert-success');
const submitButton = form.querySelector('.leads-btn');
if (!submitButton) {
console.error('Submit button not found');
return;
}
console.log("Data being sent:", data);
registerConversion("contact_us", data)
.then((success) => {
console.log("Conversion registered successfully:", success, data);
if (success) {
if (alertError) {
alertError.classList.add("d-none");
}
if (alertSuccess) {
alertSuccess.classList.remove("d-none");
}
submitButton.classList.add("d-none");
form.reset();
form.classList.remove('was-validated');
iti.setNumber('');
}
})
.catch((error) => {
if (alertError) {
alertError.innerHTML = error.msg || error;
alertError.classList.remove("d-none");
}
console.error("Failed to register conversion:", error);
});
});
});
</script><link href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.13/css/intlTelInput.css" rel="stylesheet"/><div class="container custom-container" id="contact_form"><div class="card-shadow"><div class="row card-hero background-ellipse-v2 p-2 p-md-4"><div class="col-md-6 d-flex flex-column justify-content-center"><h2 class="text-center text-md-left mb-3"> Looking for more <br/> information? </h2><p class="txt-gray txt-s mb-2 d-none d-md-block"> For more information about this Camp please contact us <br/> directly or complete the form below with your information. </p><!-- Iconos info de versión Desktop --><div class="d-none d-md-block"><ul class="list-group"><li class="d-flex justify-content-start align-items-center p-2"><img class="icon-info" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/phone.svg"/><div class="ml-2 txt-sm bold-400">305-237-2161</div></li><li class="d-flex justify-content-start align-items-center p-2 mb-2"><img class="icon-info" src="https://storage.googleapis.com/mdc-website/summercamps-courses_jazz-explorers/location.svg"/><div class="ml-2 txt-sm bold-400">11011 SW 104 St. Room 5130, Miami, FL 33176</div></li></ul></div></div><div class="col-md-6 d-flex align-items-center"><form class="form needs-validation d-flex flex-column align-items-center w-100" data-slug="jazz-explorers" id="form-contact_form" novalidate=""><div class="row w-l-responsive"><div class="form-group stamp stamp-md-gray text-left mr-3 col"><label class="mb-0 txt-xs" for="name">Name</label><input class="form-control stamp-empty" id="name" name="name" placeholder="Your name" required="" type="text"/><div class="invalid-feedback">Please enter your name.</div></div><div class="form-group stamp stamp-md-gray text-left col"><label class="mb-0 txt-xs" for="lastName">Last name</label><input class="form-control stamp-empty" id="lastName" name="lastName" placeholder="Your last name" required="" type="text"/><div class="invalid-feedback">Please enter your last name.</div></div></div><div class="form-group stamp stamp-md-gray text-left"><input class="form-control stamp-empty" id="phone" name="phone" placeholder="Phone number" required="" type="tel"/><div class="invalid-feedback" id="phoneError">Please enter your phone number.</div><div class="invalid-feedback" id="countryError">The phone number does not match the selected country.</div></div><div class="form-group stamp stamp-md-gray text-left"><label class="mb-0 txt-xs" for="email">Email</label><input class="form-control stamp-empty" id="email" name="email" placeholder="Your email address" required="" type="email"/><div class="invalid-feedback">Please enter a valid email.</div></div><div class="form-group stamp stamp-md-gray text-left" id="location-group"><label class="mb-0 txt-xs" for="campuses">Select a campus of preference</label><select class="form-control stamp-empty txt-muted" id="campuses" name="campuses" required=""><option class="txt-gray" disabled="" selected="" value="">Select a location</option><option data-locations="wolfson" value="wolfson"> Wolfson Campus </option></select><div class="invalid-feedback">Please select a campus</div></div><div class="form-group stamp stamp-md-gray text-left"><label class="mb-0 txt-xs" for="questions">Questions / Comments</label><textarea class="form-control stamp-empty" id="questions" name="questions" placeholder="Enter your questions or comments here" rows="3"></textarea></div><!-- Alertas de error y éxito --><div class="alert alert-danger d-none">Error!</div><div class="alert alert-success d-none w-75"> Thank you for submitting your request. Our admissions team will contact you soon. </div><button class="button button-primary w-l-responsive leads-btn mb-3" type="submit"> Submit form </button></form></div></div></div></div><script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.13/js/intlTelInput.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.13/js/utils.js"></script><script>
document.addEventListener("DOMContentLoaded", function () {
const form = document.querySelector(`#form-contact_form`);
if (!form) {
console.error('Form not found');
return;
}
const phoneInput = form.querySelector('#phone');
const phoneError = form.querySelector('#phoneError');
const countryError = form.querySelector('#countryError');
const locationGroup = form.querySelector('#location-group');
const campusesSelect = form.querySelector('#campuses');
const programsSelect = form.querySelector('#programs');
const iti = window.intlTelInput(phoneInput, {
utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.13/js/utils.js"
});
// Filtrar caracteres no numéricos en el campo de teléfono
phoneInput.addEventListener('input', function (event) {
phoneInput.value = phoneInput.value.replace(/\D/g, '');
});
if (campusesSelect.options.length === 2) {
campusesSelect.selectedIndex = 1;
locationGroup.style.display = 'none';
}
form.addEventListener('submit', function (event) {
event.preventDefault();
event.stopPropagation();
phoneError.style.display = 'none';
countryError.style.display = 'none';
if (form.checkValidity() === false || !iti.isValidNumber()) {
form.classList.add('was-validated');
if (!phoneInput.value) {
phoneError.style.display = 'block';
} else if (!iti.isValidNumber()) {
countryError.style.display = 'block';
}
return;
}
const formData = new FormData(form);
let selectedProgram;
// Lógica para determinar el programa seleccionado
if (programsSelect) {
// Si el dropdown existe, usar el valor seleccionado
selectedProgram = programsSelect.value;
} else if (form.hasAttribute('data-single-program')) {
// Si hay un solo programa en courses_to_show, usar ese
selectedProgram = form.getAttribute('data-single-program');
} else {
// Si no hay courses_to_show definido, usar el slug de la página
selectedProgram = form.getAttribute('data-slug');
}
const data = {
first_name: formData.get("name"),
last_name: formData.get("lastName"),
email: formData.get("email"),
phone: iti.getNumber(),
programs: selectedProgram,
locations: formData.get("campuses") || form.getAttribute('data-locations'),
additional_info: `Questions / Comments: ${formData.get("questions") || ''}`,
...loadSessionData()
};
// La fecha se manejará en el backend
data.created_at = new Date().toISOString();
const alertError = form.querySelector('.alert.alert-danger');
const alertSuccess = form.querySelector('.alert.alert-success');
const submitButton = form.querySelector('.leads-btn');
if (!submitButton) {
console.error('Submit button not found');
return;
}
// The conversion_name can be one off the following: contact_us, downloadable, purchase
registerConversion("contact_us", data)
.then((success) => {
if (success) {
if (alertError) {
alertError.classList.add("d-none");
}
if (alertSuccess) {
alertSuccess.classList.remove("d-none");
}
submitButton.classList.add("d-none");
form.reset();
form.classList.remove('was-validated');
iti.setNumber('');
}
console.log("Conversion registered successfully:", success, data);
})
.catch((error) => {
if (alertError) {
alertError.innerHTML = error.msg || error;
alertError.classList.remove("d-none");
}
console.error("Failed to register conversion:", error);
});
});
});
</script></div>