Проверка нескольких ID
Доброго времени суток, есть такой код:
var requestForm = $('#request-demo'),
Но у меня на сайте есть 2 формы, которые нужно проверить этим же способом. Есть простой вариант копи-паст + замена имен переменных. Но вот хочу узнать можно ли как то таким способом это сделать?
var requestForm = $('#request-demo')||$('#request-popup'),
Что бы проверяло любую из этих форм. |
karakym,
Ну так он тебе все время первую форму будет пихать в requestForm, если селектор верный и такая форма в ДОМе есть Пиши один метод в который будешь передавать 'demo' или 'popup' и два раза его вызывай
function checkForm(name) {
var requestForm = $('#request-' + name);
};
Цитата:
|
Цитата:
|
karakym,
натюрлих |
Цитата:
|
var $demo = $('#request-demo'),
$popup = $('#request-popup'),
requestForm = $demo.length ? $demo : $popup;
|
А что означает в данном примере: .length
|
если тега на странице не будет #request-demo
то $('#request-demo') вернет объект у которого lengt === 0 если теги на странице есть то length будет больше 0, равно колличеству объектов с данным тегом |
Цитата:
|
Вот как проходит валидация форм:
// Request Demo Form
{
// Variables
{
/* Inputs
var $demo = $('#request-demo'),
$popup = $('#request-popup'),
requestForm = $demo.length ? $demo : $popup;
*/
var requestForm = $('#request-demo'),
fullNameInput = $('#fullName'),
fullNameError = false,
phoneNumberInput = $('#phoneNumber'),
phoneNumberError = false,
emailInput = $('#email'),
emailError = false,
messageInput = $('#message'),
messageError = false,
numberCheck = /^\+?[0-9]+$/,
specialCharactersCheck = /^[а-яА-ЯёЁa-zA-Z0-9- ]*$/,
emailCheck = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
}
// Inputs Validations
{
var fullNameValidate = function(){
var fullNameVal = fullNameInput.val();
if(!fullNameVal.trim() || fullNameVal == null || fullNameVal == "" || !fullNameVal.match(specialCharactersCheck)){
fullNameInput.addClass('invalid').removeClass('valid');
fullNameError = true;
// $('html, body').animate({scrollTop: fullNameInput.offset().top - 100}, 1000);
}else{
fullNameInput.removeClass('invalid').addClass('valid');
fullNameError = false;
}
return fullNameError;
}
fullNameInput.on('keyup focusout blur', function(e){
fullNameValidate();
});
var phoneNumberValidate = function(){
var phoneNumberVal = phoneNumberInput.val();
if(phoneNumberVal == null || phoneNumberVal == "" || !phoneNumberVal.match(numberCheck)){
phoneNumberInput.addClass('invalid').removeClass('valid');
phoneNumberError = true;
// $('html, body').animate({scrollTop: phoneNumberInput.offset().top - 100}, 1000);
}else{
phoneNumberInput.removeClass('invalid').addClass('valid');
phoneNumberError = false;
}
return phoneNumberError;
}
phoneNumberInput.on('keyup focusout blur', function(e){
phoneNumberValidate();
});
var emailValidate = function(){
var emailVal = emailInput.val();
if(!emailVal.trim() || emailVal == null || emailVal == "" || !emailVal.match(emailCheck)){
emailInput.addClass('invalid').removeClass('valid');
emailError = true;
// $('html, body').animate({scrollTop: emailInput.offset().top - 100}, 1000);
}else{
emailInput.removeClass('invalid').addClass('valid');
emailError = false;
}
return emailError;
}
emailInput.on('keyup focusout blur', function(e){
emailValidate();
});
var messageValidate = function(){
var messageVal = messageInput.val();
if(!messageVal.trim() || messageVal == null || messageVal == ""){
messageInput.removeClass('invalid').removeClass('valid');
}else{
messageInput.addClass('valid').removeClass('invalid');
}
}
messageInput.on('keyup focusout blur', function(e){
messageValidate();
});
$('.close-requested').on('click', function(){
requestForm.removeClass('requested');
})
}
|
Так вы поменьше увлекайте привязкой к конкретному и будет счастье вам. Атрибут id, это идентификатор и он уникален, и зная это вы тем не менее пишите такое: var requestForm = $('#request-demo'), fullNameInput = $('#fullName'), при этом желая в перспективе обрабатывать и другие подобные. А ведь найти DOM элемент можно не только по id. Вот и ответ на вопрос: либо к примеру по классу получаем элементы формы, которые нужно проверять и устанавливаем на них обработчик, либо делегируем обработку их родительской форме. Во втором случае и не будет проблем с указанием id хоть дюжины форм - $('#request-demo, #request-popup').on('event', 'selector', function ... ). В данном обработчике this, это текущий элемент, а $(this).closest('from'), его форма. Всякие '#fullName' не нужны.
Сами обработчики - зачем их столько и при этом не отличающихся друг от друга практически ни чем? Выбрасывать их и прописывать единые правила для всех полей (что и описывает куча ваших функций). А различия, шаблоны выражений, так к ним нужно обращаться не как numberCheck и подобному, а как к свойству объекта, имя которого есть либо имя поля, либо тип. |
| Часовой пояс GMT +3, время: 15:13. |