|
|
@ -279,11 +279,20 @@ |
|
|
|
<div class="col-md-4"> |
|
|
|
<div class="mb-4"> |
|
|
|
<div class="form-floating"> |
|
|
|
<input type="text" class="form-control" name="mobile" asp-for="mobile" placeholder="(+44) 99000000" prefix="+44" value="+44" required> |
|
|
|
<input type="text" class="form-control" id="mobile" name="mobile" asp-for="mobile" placeholder="(+44) 99000000" value="+44" required> |
|
|
|
<label for="mobile">Mobile Number *</label> |
|
|
|
<span id="mobile-error" class="text-danger"></span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@* <div class="col-md-4"> |
|
|
|
<div class="mb-4"> |
|
|
|
<div class="form-floating"> |
|
|
|
<input type="text" class="form-control" name="mobile" asp-for="mobile" placeholder="(+44) 99000000" value="+44" oninput="checkDefaultValue(this)" required> |
|
|
|
<label for="mobile">Mobile Number *</label> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> *@ |
|
|
|
<div class="col-md-4"> |
|
|
|
<div class="mb-4"> |
|
|
|
<div class="form-floating"> |
|
|
@ -530,9 +539,79 @@ |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
document.getElementById('mobile').addEventListener('input', function (e) { |
|
|
|
var x = e.target.value.replace(/\D/g, '').match(/(\d{0,2})(\d{0,3})(\d{0,3})(\d{0,2})(\d{0,2})/); |
|
|
|
// document.getElementById('mobile').addEventListener('input', function (e) { |
|
|
|
// var x = e.target.value.replace(/\D/g, '').match(/(\d{0,2})(\d{0,3})(\d{0,3})(\d{0,2})(\d{0,2})/); |
|
|
|
// e.target.value = '+44' + x[2] + '' + x[3] + '' + x[4] + '' + x[5]; |
|
|
|
// }); |
|
|
|
const mobileInput = document.getElementById('mobile'); |
|
|
|
const mobileError = document.getElementById('mobile-error'); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
mobileInput.addEventListener('input', validateMobileNumber); |
|
|
|
mobileInput.addEventListener('keydown', validateMobileNumber); |
|
|
|
mobileInput.addEventListener('keyup', validateMobileNumber); |
|
|
|
mobileInput.addEventListener('click', validateMobileNumber); |
|
|
|
|
|
|
|
function validateMobileNumber(e) { |
|
|
|
const inputValue = e.target.value; |
|
|
|
|
|
|
|
// Check if the current value is the default value |
|
|
|
if (inputValue === '+44') { |
|
|
|
mobileError.textContent = 'Invalid Mobile Number'; |
|
|
|
} else { |
|
|
|
// Reset the error message |
|
|
|
mobileError.textContent = ''; |
|
|
|
} |
|
|
|
|
|
|
|
// Handle 'keydown' event |
|
|
|
if (e.type === 'keydown' && inputValue === '+44') { |
|
|
|
e.target.value = ''; |
|
|
|
} |
|
|
|
|
|
|
|
// Handle 'click' event |
|
|
|
if (e.type === 'click' && inputValue === '+44') { |
|
|
|
e.target.value = ''; |
|
|
|
} |
|
|
|
|
|
|
|
// Format the input as a phone number with the "+44" prefix |
|
|
|
const x = inputValue.replace(/\D/g, '').match(/(\d{0,2})(\d{0,3})(\d{0,3})(\d{0,2})(\d{0,2})/); |
|
|
|
e.target.value = '+44' + x[2] + '' + x[3] + '' + x[4] + '' + x[5]; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// Handle input events (input and keydown) |
|
|
|
// mobileInput.addEventListener('input', validateMobileNumber); |
|
|
|
// mobileInput.addEventListener('keydown', validateMobileNumber); |
|
|
|
|
|
|
|
// function validateMobileNumber(e) { |
|
|
|
// const inputValue = e.target.value; |
|
|
|
// if (e.type === 'keydown' && inputValue === '+44') { |
|
|
|
// e.target.value = ''; |
|
|
|
// } |
|
|
|
// // Check if the current value is the default value |
|
|
|
// if (inputValue === '+44') { |
|
|
|
// mobileError.textContent = 'Invalid Mobile Number'; |
|
|
|
// } else { |
|
|
|
// // Reset the error message |
|
|
|
// mobileError.textContent = ''; |
|
|
|
// } |
|
|
|
|
|
|
|
// // Format the input as a phone number with the "+44" prefix |
|
|
|
// const x = inputValue.replace(/\D/g, '').match(/(\d{0,2})(\d{0,3})(\d{0,3})(\d{0,2})(\d{0,2})/); |
|
|
|
// e.target.value = '+44' + x[2] + '' + x[3] + '' + x[4] + '' + x[5]; |
|
|
|
// } |
|
|
|
|
|
|
|
// Handle form submission |
|
|
|
document.querySelector('form').addEventListener('submit', function (event) { |
|
|
|
// Check if the mobile number is still the default value |
|
|
|
if (mobileInput.value === '+44') { |
|
|
|
mobileError.textContent = 'Invalid Mobile Number'; |
|
|
|
event.preventDefault(); // Prevent form submission |
|
|
|
} else { |
|
|
|
// Reset the error message |
|
|
|
mobileError.textContent = ''; |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
// $('#mobile').keyup(function () { |
|
|
|