You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
251 lines
8.3 KiB
251 lines
8.3 KiB
function show_error(message){ |
|
$('#error_alert').slideDown(500); |
|
$('#error_alert').delay(2000).slideUp(); |
|
if (message) |
|
$('#alert_error_text').text(message) |
|
} |
|
|
|
function show_success(message){ |
|
$('#success_alert').slideDown(500); |
|
$('#success_alert').delay(2000).slideUp(); |
|
if (message) |
|
$('#alert_success_text').text(message) |
|
} |
|
|
|
function validate_length(val, dest_len){ |
|
if(val.length < dest_len){ |
|
return false; |
|
} |
|
return true; |
|
} |
|
|
|
$(document).ready(function(){ |
|
|
|
|
|
|
|
$('body').append('<div id="error_alert" class="alert alert-danger" role="alert" style="position: fixed; top: 50px; left: 10%; right: 10%; z-index: 9999; display: none;">Ошибка<br><small id="alert_error_text"></small></div>'); |
|
$('body').append('<div id="success_alert" class="alert alert-success" role="alert" style="position: fixed; top: 50px; left: 10%; right: 10%; z-index: 9999; display: none;">Успех<br><small id="alert_success_text"></small></div>'); |
|
|
|
$('#fio').on('input', function () { |
|
let input = $(this).val(); |
|
|
|
// Убираем все лишние символы, кроме букв и пробелов |
|
input = input.replace(/[^a-zA-Zа-яА-ЯёЁ ]/g, ''); |
|
|
|
// Преобразуем каждое слово, чтобы оно начиналось с заглавной буквы |
|
let formattedInput = input.split(' ').map(word => { |
|
if (word.length > 0) { |
|
return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase(); |
|
} |
|
return ''; // Пустые слова не трогаем |
|
}).join(' '); // Объединяем обратно с пробелами |
|
|
|
// Обновляем поле ввода с отформатированным текстом |
|
$(this).val(formattedInput); |
|
|
|
// Проверяем количество слов |
|
let words = formattedInput.trim().split(/\s+/); // Убираем лишние пробелы |
|
if (words.length < 3 || words.some(word => word.length < 2)) { |
|
$(this).parent().removeClass('success-field').addClass('errors-field'); // Подсветить поле |
|
} else { |
|
$(this).parent().removeClass('errors-field').addClass('success-field'); // Убрать подсветку |
|
} |
|
}); |
|
|
|
|
|
|
|
$('#tel').on('change', function() { |
|
if($(this).val().length != 16){ |
|
$(this).parent().removeClass('success-field').addClass('errors-field'); |
|
} else{ |
|
$(this).parent().removeClass('errors-field').addClass('success-field'); |
|
} |
|
}); |
|
|
|
|
|
|
|
$("#dob").attr('maxlength','4'); |
|
$('#dob').on('input', function() { |
|
let input = $(this).val(); |
|
// Удаляем все символы, кроме цифр |
|
input = input.replace(/\D/g, ''); |
|
// Обновляем поле ввода |
|
$(this).val(input); |
|
|
|
// Проверка на минимальную длину (не менее 11 символов) |
|
if (input.length < 4) { |
|
// Если введено меньше цифр, показываем ошибку |
|
$(this).parent().removeClass('success-field').addClass('errors-field'); |
|
} else { |
|
// Если введено достаточно цифр, показываем успех |
|
$(this).parent().removeClass('errors-field').addClass('success-field'); |
|
} |
|
}); |
|
|
|
|
|
$("#kod").attr('maxlength','4'); |
|
$('#kod').on('input', function() { |
|
let input = $(this).val(); |
|
// Удаляем все символы, кроме цифр |
|
input = input.replace(/\D/g, ''); |
|
// Обновляем поле ввода |
|
$(this).val(input); |
|
|
|
// Проверка на минимальную длину (не менее 11 символов) |
|
if (input.length < 4) { |
|
// Если введено меньше цифр, показываем ошибку |
|
$(this).parent().removeClass('success-field').addClass('errors-field'); |
|
} else { |
|
// Если введено достаточно цифр, показываем успех |
|
$(this).parent().removeClass('errors-field').addClass('success-field'); |
|
} |
|
}); |
|
|
|
$("#form_submit").click(function(){ |
|
|
|
$(this).children(".spinner-border").removeClass('d-none'); |
|
$(this).attr("disabled", true); |
|
message = {} |
|
|
|
|
|
if(!(validate_length($('#fio').val(), 3))) |
|
{ |
|
show_error('Введите ФИО', false); |
|
$(this).children(".spinner-border").addClass('d-none'); |
|
$(this).removeAttr("disabled"); |
|
return; |
|
} |
|
|
|
if(!(validate_length($('#tel').val(), 16))) |
|
{ |
|
show_error('Введите Телефон', false); |
|
$(this).children(".spinner-border").addClass('d-none'); |
|
$(this).removeAttr("disabled"); |
|
return; |
|
} |
|
|
|
if ($('#dob').val().length !== 4 || new Date().getFullYear() - new Date($('#dob').val()).getFullYear() > 80) { |
|
show_error('Дата рождения должна быть корректной и возраст не более 80 лет', false); |
|
$(this).children(".spinner-border").addClass('d-none'); |
|
$(this).removeAttr("disabled"); |
|
return; |
|
} |
|
|
|
|
|
|
|
|
|
|
|
$.each($('.tg_input'), function(e) { |
|
message[$(this).prop("id")] = $(this).val(); |
|
}); |
|
$.ajax({ |
|
type: "post", |
|
url: "/form_submit", |
|
processData: false, // tell jQuery not to process the data |
|
contentType: false, // tell jQuery not to set contentType |
|
async: true, |
|
data: JSON.stringify(message), |
|
success: (data) => { |
|
if(data.success==true){ |
|
$(this).children(".spinner-border").addClass('d-none'); |
|
$(this).removeAttr("disabled"); |
|
console.log(data); |
|
show_success("Данные сохранены!") |
|
} |
|
else{ |
|
show_error(data.error); |
|
$(this).children(".spinner-border").addClass('d-none'); |
|
$(this).removeAttr("disabled"); |
|
} |
|
}, |
|
error:function (jqXHR, exception) { |
|
$(this).children(".spinner-border").addClass('d-none'); |
|
$(this).removeAttr("disabled"); |
|
show_error('Что-то пошло не так', false) |
|
} |
|
}); |
|
}); |
|
|
|
$('#clear_tel').click(function(){ |
|
phoneStr = ''; |
|
phoneInput.value = formatPhoneString(); |
|
}) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// $('.alert-placeholder').mouseenter(function(){ |
|
// var popOverSettings = { |
|
// placement: 'bottom', |
|
// content: $(this).data('content'), |
|
// trigger: 'hover', |
|
// container: this, |
|
// offset: '0' |
|
// } |
|
// $(this).popover(popOverSettings); |
|
// $(this).popover('show'); |
|
// $('.popover').addClass('alert-popover'); |
|
// }); |
|
// $('.alert-placeholder').mouseleave(function(){ |
|
// $('.alert-popover').remove() |
|
// }); |
|
|
|
|
|
|
|
let phoneStr = ''; |
|
let formattedStr = ''; |
|
let deleteMode = false; |
|
const phoneInput = document.querySelector('#tel'); |
|
const defaultFormat = '+7({0}{1}{2}){3}{4}{5}-{6}{7}-{8}{9}'; |
|
phoneInput.value = formatPhoneString(); |
|
|
|
phoneInput.addEventListener('keydown', (e) => { |
|
if (e.key === 'Backspace') |
|
deleteMode = true; |
|
else |
|
deleteMode = false; |
|
}); |
|
|
|
phoneInput.addEventListener('input', (e) => { |
|
if (deleteMode) { |
|
phoneInput.value = phoneInput.value; |
|
phoneStr = parsePhoneString(phoneInput.value.replace("+7", "").replace("-", "")); |
|
} else { |
|
if (e.inputType == 'insertText' && !isNaN(parseInt(e.data))) { |
|
if (phoneStr.length <= 9) |
|
phoneStr += e.data; |
|
} |
|
phoneInput.value = formatPhoneString(); |
|
} |
|
}); |
|
|
|
function formatPhoneString() { |
|
let strArr = phoneStr.split(''); |
|
formattedStr = defaultFormat; |
|
for (let i = 0; i < strArr.length; i++) { |
|
formattedStr = formattedStr.replace(`{${i}}`, strArr[i]); |
|
} |
|
|
|
if (formattedStr.indexOf('{') === -1) |
|
{ |
|
return formattedStr; |
|
} |
|
else |
|
{ |
|
return formattedStr.substring(0, formattedStr.indexOf('{')); |
|
} |
|
} |
|
|
|
function parsePhoneString(str) { |
|
return str.replace(' ', '').replace('(', '').replace(')', '').replace('-', ''); |
|
} |
|
}); |
|
|
|
|
|
|