Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.07.2015, 09:52
Аватар для Duda.Ml1986@gmail.com
Профессор
Отправить личное сообщение для Duda.Ml1986@gmail.com Посмотреть профиль Найти все сообщения от Duda.Ml1986@gmail.com
 
Регистрация: 01.09.2011
Сообщений: 263

Формы отправки сообщений
Всем привет,

Есть сайт на котором люди могут отправлять формы предварительно заполнив поля, после нажатия кнопки отправки проходит валидация в js, потом аяксом отправляется. Возможно у вас есть решения более эффективные? Потому что когда на сайте 5 форм повторяемость кода ужасает.

Код ниже аналогичен для другой формы, в ней может меняться количество полей и содержание.
Спасибо.

Как сделать лучше?


Код обработки одной формы.
var free_call = new Object();
    $('#sendButton').click(function(e) {
        free_call.name = $('#freeCallButtonName').val();
        free_call.email = $('#freeCallButtonEmail').val();
        free_call.phone = $('#freeCallButtonPhone').val();
        free_call.city = $('#freeCallButtonCity').val();
        free_call.time_to_call = $('#freeCallButtonMessage').val();
        errorValidation = false;
        if (free_call.city == 'ВВЕДИТЕ ГОРОД')
        {
            errorValidation = true;
            $('#freeCallButtonCity').css('color','red');

            setTimeout(function() {
                $('#freeCallButtonCity').css('color','#02b6f5');

            }, 2500);
        }
        if (free_call.name == 'ВВЕДИТЕ ИМЯ')
        {
            errorValidation = true;
            $('#freeCallButtonName').css('color','red');

            setTimeout(function() {
                $('#freeCallButtonName').css('color','#02b6f5');

            }, 2500);
        }
        if (free_call.email == 'ВВЕДИТЕ EMAIL')
        {
            errorValidation = true;
            $('#freeCallButtonEmail').css('color','red');

            setTimeout(function() {
                $('#freeCallButtonEmail').css('color','#02b6f5');

            }, 2500);
        }
        if (free_call.phone == 'ВВЕДИТЕ ТЕЛЕФОН')
        {
            errorValidation = true;
            $('#freeCallButtonPhone').css('color','red');

            setTimeout(function() {
                $('#freeCallButtonPhone').css('color','#02b6f5');

            }, 2500);
        }
        if (errorValidation == false){

            ga('send','event', 'Offer','FreeCall');

            if(activationButton == 'topcall')
            {
                ga('send','event', 'Offer','FreeCallTop');

            } else if (activationButton == 'botcall')
            {
                ga('send','event', 'Offer','FreeCallBot');

            } else if (activationButton == 'concall')
            {
                ga('send','event', 'Offer','FreeCallCon');
            }

            $.ajax({
                type: "POST",
                url: "/",
                data: {
                    'action': 'ajax',
                    'form': 'freeCall',
                    'name': free_call.name,
                    'urlaction': location.href,
                    'email': free_call.email,
                    'phone': free_call.phone,
                    'city': free_call.city,
                    'message': free_call.time_to_call
                }
            })
            .done(function( msg ) {
                $('#freeCallButtonName').val('ВВЕДИТЕ ИМЯ');
                $('#freeCallButtonEmail').val('ВВЕДИТЕ EMAIL');
                $('#freeCallButtonPhone').val('ВВЕДИТЕ ТЕЛЕФОН');
                $('#freeCallButtonCity').val('ВВЕДИТЕ ГОРОД');
                $('#freeCallButtonMessage').val('ВВЕДИТЕ УДОБНОЕ ДЛЯ ЗВОНКА ВРЕМЯ');
                $('#freeCallButtonPopUp').bPopup().close();
                $('#thanks h2').text('Спасибо за ваш запрос');
                $('#thanks').bPopup({});
                setTimeout(function() {
                    $('#thanks').bPopup().close();
                }, 2500);
            });
        }
    })
Ответить с цитированием
  #2 (permalink)  
Старый 30.07.2015, 11:35
Аватар для Duda.Ml1986@gmail.com
Профессор
Отправить личное сообщение для Duda.Ml1986@gmail.com Посмотреть профиль Найти все сообщения от Duda.Ml1986@gmail.com
 
Регистрация: 01.09.2011
Сообщений: 263

activationButton - переменная которая изменяется при вызове всплывающего окна.
Ответить с цитированием
  #3 (permalink)  
Старый 30.07.2015, 11:36
Аватар для Duda.Ml1986@gmail.com
Профессор
Отправить личное сообщение для Duda.Ml1986@gmail.com Посмотреть профиль Найти все сообщения от Duda.Ml1986@gmail.com
 
Регистрация: 01.09.2011
Сообщений: 263

<div class="formPopUp">
            <input type="text" class="form-control" id="freeCallButtonName"
                   value="ВВЕДИТЕ ИМЯ"
                   onfocus="if (this.value=='ВВЕДИТЕ ИМЯ'){this.value=''}"
                   onblur="if (this.value==''){this.value='ВВЕДИТЕ ИМЯ'}">
            <input type="text" class="form-control" id="freeCallButtonEmail"
                   value="ВВЕДИТЕ EMAIL"
                   onfocus="if (this.value=='ВВЕДИТЕ EMAIL'){this.value=''}"
                   onblur="if (this.value==''){this.value='ВВЕДИТЕ EMAIL'}">
            <input type="text" class="form-control"
                   id="freeCallButtonPhone"
                   value="ВВЕДИТЕ ТЕЛЕФОН"
                   onfocus="if (this.value=='ВВЕДИТЕ ТЕЛЕФОН'){this.value=''}"
                   onblur="if (this.value==''){this.value='ВВЕДИТЕ ТЕЛЕФОН'}">
                <input type="text" class="form-control"
               id="freeCallButtonCity"
               value="ВВЕДИТЕ ГОРОД"
               onfocus="if (this.value=='ВВЕДИТЕ ГОРОД'){this.value=''}"
               onblur="if (this.value==''){this.value='ВВЕДИТЕ ГОРОД'}">
            <input class="form-control" id="freeCallButtonMessage"
                   value="ВВЕДИТЕ УДОБНОЕ ДЛЯ ЗВОНКА ВРЕМЯ"
                   onfocus="if (this.value=='ВВЕДИТЕ УДОБНОЕ ДЛЯ ЗВОНКА ВРЕМЯ'){this.value=''}"
                   onblur="if (this.value==''){this.value='ВВЕДИТЕ УДОБНОЕ ДЛЯ ЗВОНКА ВРЕМЯ'}">
            <input type="hidden" name="freeCallButtonPopUp">
            <a id="sendButton" href="#"></a>
    </div>
Ответить с цитированием
  #4 (permalink)  
Старый 30.07.2015, 16:09
Аватар для Duda.Ml1986@gmail.com
Профессор
Отправить личное сообщение для Duda.Ml1986@gmail.com Посмотреть профиль Найти все сообщения от Duda.Ml1986@gmail.com
 
Регистрация: 01.09.2011
Сообщений: 263

Ответить с цитированием
  #5 (permalink)  
Старый 31.07.2015, 20:46
Аспирант
Отправить личное сообщение для fancy Посмотреть профиль Найти все сообщения от fancy
 
Регистрация: 16.12.2014
Сообщений: 67

Попробуй http://fancyjs.com
Доки нет, но есть примеры с кодом.
Все просто.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как сделать задержку отправки формы на javascript? Akimserg Общие вопросы Javascript 12 19.10.2015 13:15
Закрытие контактной формы после отправки сообщения. maddy Общие вопросы Javascript 2 12.01.2015 07:25
Как сделать disabled кнопки во время отправки формы? Bad Request Events/DOM/Window 7 16.04.2014 13:49
Не могу разобрать механизм отправки формы kreon Angular.js 3 19.12.2013 13:04
Запрет отправки формы. Garroshek Общие вопросы Javascript 5 12.09.2013 06:29