[add] hide btn on submit

et#36
tribikram 2 years ago
parent c08a99aaa6
commit b229e57e65
  1. 3
      public/frontend/css/style.css
  2. 71
      resources/views/appointment.blade.php
  3. 14
      resources/views/enquiry-form.blade.php

@ -2000,6 +2000,9 @@ table.lightgrey-weekends tbody td:nth-child(n+6) {
.displayBtn{
display: block;
}
.displayEnqBtn{
display: inline-block;
}
/* Footer Css */
/* mobile view css */
@media only screen and (min-width: 320px) and (max-width: 480px) {

@ -81,15 +81,18 @@
<input type="hidden" name="appointment_id" id="appointment_id">
<div class="form-group mb-2">
<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 class="form-group mb-2">
<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 class="form-group mb-2">
<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 class="form-group mb-2">
<label for="notes">Notes</label>
@ -99,7 +102,10 @@
</div>
<div class="modal-footer">
<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>
@ -241,8 +247,58 @@
}
function submitAppointment(event){
event.preventDefault();
appNameError = document.getElementById('app-name-error');
appEmailError = document.getElementById('app-email-error');
appPhoneError = document.getElementById('app-phone-error');
loaderenqBtn = document.getElementById('buttonenqload');
appointmentBtn = document.getElementById('appointmentbtn');
function validateAppName(){
var appName = document.getElementById('app-name').value;
if(appName.length == 0){
$('#name-email').focus();
appNameError.innerHTML = "Name Field is required !";
return false;
}
appNameError.innerHTML = '';
return true;
}
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",
@ -252,6 +308,7 @@
// 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']+' )',
@ -262,7 +319,7 @@
)
}
});
}
}
</script>

@ -256,7 +256,10 @@
</div>
</div>
<div class="col-md-12 text-center">
<button type="submit" class="enquiry-from-btn">Submit</button>
<button type="submit" class="enquiry-from-btn" id="enquirybtn">Submit</button>
<button type="submit" class="enquiry-from-btn buttonload" id="enquirybutnload" disabled>
<i class="fas fa-spinner fa-pulse"></i> Submiting
</button>
</div>
</div>
</form>
@ -270,13 +273,13 @@
var status = "<?php echo $status; ?>";
if(php_var.length !== 0){
if(php_var.length !== 0){
Swal.fire({
title: 'Submitted!!',
text: php_var,
icon: status ? 'success' : 'error'
})
}
}
fnameError = document.getElementById('error-fname');
lnameError = document.getElementById('error-lname');
dobError = document.getElementById('error-dob');
@ -533,6 +536,8 @@ if(php_var.length !== 0){
return true;
}
var enqloaderBtn = document.getElementById('enquirybutnload');
var enquirybtn = document.getElementById('enquirybtn');
function submitEnquiry(){
if(!validatefName() || !validatelName() || !validateDob() || !eCob() || !eGender() ||
!validateAddress() || !validateEmail() || !validatePhone() || !validateQualification() ||
@ -540,7 +545,8 @@ if(php_var.length !== 0){
!wExperience() || !validateImmigrationHistory() || !validateStudyField()){
return false;
}else{
enqloaderBtn.classList.add('displayEnqBtn');
enquirybtn.classList.add('buttonload')
}
}
</script>

Loading…
Cancel
Save