|
|
|
@ -81,15 +81,18 @@ |
|
|
|
<input type="hidden" name="appointment_id" id="appointment_id"> |
|
|
|
<input type="hidden" name="appointment_id" id="appointment_id"> |
|
|
|
<div class="form-group mb-2"> |
|
|
|
<div class="form-group mb-2"> |
|
|
|
<label for="name">Name</label> |
|
|
|
<label for="name">Name</label> |
|
|
|
<input type="text" class="form-control mt-1" id="name" name="name" required> |
|
|
|
<input type="text" class="form-control mt-1" id="app-name" name="name" onkeyup="validateAppName()"> |
|
|
|
|
|
|
|
<span class="error" id="app-name-error"></span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="form-group mb-2"> |
|
|
|
<div class="form-group mb-2"> |
|
|
|
<label for="email">Email</label> |
|
|
|
<label for="email">Email</label> |
|
|
|
<input type="email" class="form-control mt-1" id="email" name="email" required> |
|
|
|
<input type="email" class="form-control mt-1" id="app-email" name="email" onkeyup="validateAppEmail()"> |
|
|
|
|
|
|
|
<span class="error" id="app-email-error"></span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="form-group mb-2"> |
|
|
|
<div class="form-group mb-2"> |
|
|
|
<label for="phone">Phone</label> |
|
|
|
<label for="phone">Phone</label> |
|
|
|
<input type="tel" class="form-control mt-1" id="phone" name="phone" required> |
|
|
|
<input type="tel" class="form-control mt-1" id="app-phone" name="phone" onkeyup="validateAppPhone()"> |
|
|
|
|
|
|
|
<span class="error" id="app-phone-error"></span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="form-group mb-2"> |
|
|
|
<div class="form-group mb-2"> |
|
|
|
<label for="notes">Notes</label> |
|
|
|
<label for="notes">Notes</label> |
|
|
|
@ -99,7 +102,10 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="modal-footer"> |
|
|
|
<div class="modal-footer"> |
|
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> |
|
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> |
|
|
|
<button type="button" onclick = "submitAppointment(event)" class="btn btn-primary">Book Appointment</button> |
|
|
|
<button type="button" onclick = "submitAppointment()" class="btn btn-primary" id="appointmentbtn">Book Appointment</button> |
|
|
|
|
|
|
|
<button class="buttonload btn btn-primary" id="buttonenqload" disabled> |
|
|
|
|
|
|
|
<i class="fas fa-spinner fa-pulse"></i> Submiting |
|
|
|
|
|
|
|
</button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -241,28 +247,79 @@ |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function submitAppointment(event){ |
|
|
|
appNameError = document.getElementById('app-name-error'); |
|
|
|
event.preventDefault(); |
|
|
|
appEmailError = document.getElementById('app-email-error'); |
|
|
|
$.ajax({ |
|
|
|
appPhoneError = document.getElementById('app-phone-error'); |
|
|
|
url: "/appointment_submit", |
|
|
|
loaderenqBtn = document.getElementById('buttonenqload'); |
|
|
|
type: "post", |
|
|
|
appointmentBtn = document.getElementById('appointmentbtn'); |
|
|
|
data: $("form").serialize(), |
|
|
|
function validateAppName(){ |
|
|
|
success: function(response) { |
|
|
|
var appName = document.getElementById('app-name').value; |
|
|
|
$("#modal").modal("hide"); |
|
|
|
if(appName.length == 0){ |
|
|
|
// var isAmStart = response.appointment.start_time < '12:00:00'; |
|
|
|
$('#name-email').focus(); |
|
|
|
// var isAmEnd = response.appointment.end_time < '12:00:00'; |
|
|
|
appNameError.innerHTML = "Name Field is required !"; |
|
|
|
|
|
|
|
return false; |
|
|
|
Swal.fire({ |
|
|
|
} |
|
|
|
title: 'Booked!!', |
|
|
|
appNameError.innerHTML = ''; |
|
|
|
text: 'Appointment Successfully Booked for '+response.appointment_detail['name']+' at '+response.formated_date +'('+response.appointment['start_time']+' - ' + response.appointment['end_time']+' )', |
|
|
|
return true; |
|
|
|
icon: 'success' |
|
|
|
} |
|
|
|
}).then(function(){ |
|
|
|
|
|
|
|
location.reload(); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function validateAppEmail(){ |
|
|
|
|
|
|
|
var appEmail = document.getElementById('app-email').value; |
|
|
|
|
|
|
|
if(appEmail.length == 0){ |
|
|
|
|
|
|
|
$('#name-email').focus(); |
|
|
|
|
|
|
|
appEmailError.innerHTML = "Email Field is required !"; |
|
|
|
|
|
|
|
return false; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
if(!appEmail.match(/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(.\w{2,3})+$/)){ |
|
|
|
|
|
|
|
appEmailError.innerHTML = "Invalid email address"; |
|
|
|
|
|
|
|
return false; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
appEmailError.innerHTML = ''; |
|
|
|
|
|
|
|
return true; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function validateAppPhone(){ |
|
|
|
|
|
|
|
var appPhone = document.getElementById('app-phone').value; |
|
|
|
|
|
|
|
if(appPhone.length == 0){ |
|
|
|
|
|
|
|
$('#app-phone').focus(); |
|
|
|
|
|
|
|
appPhoneError.innerHTML = "Phone Field is required !"; |
|
|
|
|
|
|
|
return false; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
if(!appPhone.match(/^\d{10}$/)){ |
|
|
|
|
|
|
|
appPhoneError.innerHTML = "Invalid mobile number"; |
|
|
|
|
|
|
|
return false; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
appPhoneError.innerHTML = ''; |
|
|
|
|
|
|
|
return true; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function submitAppointment(){ |
|
|
|
|
|
|
|
if(!validateAppName() || !validateAppEmail() || !validateAppPhone()){ |
|
|
|
|
|
|
|
return false; |
|
|
|
|
|
|
|
}else{ |
|
|
|
|
|
|
|
loaderenqBtn.classList.add('displayBtn') |
|
|
|
|
|
|
|
appointmentBtn.classList.add('buttonload') |
|
|
|
|
|
|
|
$.ajax({ |
|
|
|
|
|
|
|
url: "/appointment_submit", |
|
|
|
|
|
|
|
type: "post", |
|
|
|
|
|
|
|
data: $("form").serialize(), |
|
|
|
|
|
|
|
success: function(response) { |
|
|
|
|
|
|
|
$("#modal").modal("hide"); |
|
|
|
|
|
|
|
// var isAmStart = response.appointment.start_time < '12:00:00'; |
|
|
|
|
|
|
|
// var isAmEnd = response.appointment.end_time < '12:00:00'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
loaderenqBtn.classList.remove('displayBtn'); |
|
|
|
|
|
|
|
Swal.fire({ |
|
|
|
|
|
|
|
title: 'Booked!!', |
|
|
|
|
|
|
|
text: 'Appointment Successfully Booked for '+response.appointment_detail['name']+' at '+response.formated_date +'('+response.appointment['start_time']+' - ' + response.appointment['end_time']+' )', |
|
|
|
|
|
|
|
icon: 'success' |
|
|
|
|
|
|
|
}).then(function(){ |
|
|
|
|
|
|
|
location.reload(); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
</script> |
|
|
|
</script> |
|
|
|
|
