Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.04.2020, 17:10
Новичок на форуме
Отправить личное сообщение для alshanskiy Посмотреть профиль Найти все сообщения от alshanskiy
 
Регистрация: 30.04.2020
Сообщений: 3

Отправка цели в Яндекс Метрику из Формы
Здравствуйте.
На многих моих сайтах сделанных мной, стоят "формы". Они передают данные в телеграм, а так же отправляют копии на почты.
Сама форма и весь код практически взят из урока "Библиотека PHPMailer. Отправка писем средствами AJAX". Я ее немного преобразовал под себя, встроил в опенкарт. Чуть чуть дописал Яваскрипт методами "ОК ГУГЛ". Работает она прекрасно, как мне и требуется. Проверки на заполнения, что бы пробелы не отправлялись, все было хорошо, пока не пришел СЕОшник.
Он сказал, что надо на все настроить цели. Хоп. Мы настроили цели, как по справке яндекса.
Через месяц работы мы выяснили, что:
Целей по форме было 100 штук. А писем пришло только 65 (условные данные.)
И тут я понял, что это происходит из-за нажатия отправки по кнопки SUBMIT
Но ява скрипт при нажатии проверяет корректность формы, и может ее не отправить если не заполнены поля.
Иногда пользователь два - три раза нажимает submit перед тем как форма отправиться.
Я Сам не знаю яваскрипт, не мешало бы мне его выучить, но вопрос такой.
Как правильно вставить момент отправки цели, после всех удачных событий.
Код прилагаю.

<form action="" method="post" id="zakaz-seychas">
    <input type="text" name="myname"    id="myname"     placeholder="Имя *">
    <span></span>
    <input type="text" name="myphone"   id="myphone"    placeholder="Телефон *">
    <span></span>
    <input type="text" name="mymail"    id="mymail"     placeholder="E-mail">
    <span></span>
    <input type="text" name="mycomment" id="mycomment"  placeholder="Сообщение">
    <span></span>
    <button type="submit" name="submit" id="submit" value="ЗАКАЗАТЬ СЕЙЧАС">ЗАКАЗАТЬ СЕЙЧАС</button>
    <span></span>
</form>


<script>
     $(function(){
           $('#zakaz-seychas').submit(function(){
           $('#zakaz-seychas').find('input, textarea').removeClass("danger"); // удаляю класс *обязательно к заполнению
           $('#zakaz-seychas').find('input, textarea').removeClass("succses"); // удаляю класс *успешно заполненно                                   
           var errors = false;
           $(this).find('span').empty(); // очищаем спаны
           $(this).find('input, textarea').not(':input#mymail').each(function(){
                if( $.trim( $(this).val() ) == '' ) {
                     errors = true;
                     $(this).addClass("danger"); // ставим класс *обязательно к заполнению
                }
                else{
                     $(this).addClass("succses"); // ставим класс *успешно заполненно   
                }
           });
             if( !errors ){
                 var data = $('#zakaz-seychas').serialize();
                 $.ajax({
                    url: 'catalog/view/theme/zebra/template/phpmailer/sendform2.php', // могу и этот файл отправить
                    type: 'POST',
                    data: data,
                    beforeSend: function(){
                     	 $('#zakazing').modal('hide') // скрываю модалку с формой
                         $('#sending').modal('show') // запускаю модалку с отправкой формы и прогрессбаром 
                    },
                    success: function(res){
                        if( res == 1 ){
                            $('#zakaz-seychas').find('input, textarea').removeClass("danger");
                            // удаляю класс *обязательно к заполнению
                            $('#zakaz-seychas').find('input, textarea').addClass("succses");
                            // удаляю класс *успешно заполненно 
                            $('#zakaz-seychas').find('input:not(#submit), textarea').val('');
                            // очищаем значения полей при успешной отправки
                            $('#submit').next().empty();
                            // очищаем поясняняющий спан "отправляю"
                            $('#sending').modal('hide'); 
                            // прячу модалку "отправка формы и прогрессбаром"

                            //////////////////////////////////////////////////
                            // ВОТ В ЭТО МЕСТО НУЖНО ВСТАВИТЬ ОТПРАВКУ ЦЕЛИ//
                            //////////////////////////////////////////////////

                            alert('Письмо успешно отправлено');
                            // алерт об успехе
                            $('#zakaz-seychas').find('input, textarea').removeClass("succses"); 
                            // удаляю класс *успешно заполненно     
                        }else{
                            $('#submit').next().empty();
                            alert('Ошибка 1049');
                        }
                    },
                    error: function(){
                        alert('Ошибка 1059!');
                    }
                });
            }
            return false;
         });
     });
</script>


Второй вариант установки кода цели в форму согласно яндекс.справки
<form action="">
    <input type="button" onclick="ym(XXXXXX, 'reachGoal', 'TARGET_NAME'); return true;" value="Заказать" />
</form>

Второй вариант установки кода цели в форму согласно яндекс.справки
<form action="" method="get" onsubmit="ym(XXXXXX, 'reachGoal', 'TARGET_NAME'); return true;">
</form>


в обоих случаях, при многократном нажатии инпута и удачной отправки формы на почту и в ТГ отправляется много целей, вместо одной.

Пожалуйста помогите.
Ответить с цитированием
  #2 (permalink)  
Старый 30.04.2020, 18:02
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,714

alshanskiy, у вас используется типа такой код для метрики — ym(XXXXXX, 'reachGoal', 'TARGET_NAME');

Так вставьте его туда, где у вас написано ВОТ В ЭТО МЕСТО НУЖНО ВСТАВИТЬ ОТПРАВКУ ЦЕЛИ (строка №43)
Ответить с цитированием
  #3 (permalink)  
Старый 30.04.2020, 18:19
Новичок на форуме
Отправить личное сообщение для alshanskiy Посмотреть профиль Найти все сообщения от alshanskiy
 
Регистрация: 30.04.2020
Сообщений: 3

Сообщение от Malleys Посмотреть сообщение
alshanskiy, у вас используется типа такой код для метрики — ym(XXXXXX, 'reachGoal', 'TARGET_NAME');

Так вставьте его туда, где у вас написано ВОТ В ЭТО МЕСТО НУЖНО ВСТАВИТЬ ОТПРАВКУ ЦЕЛИ (строка №43)
я попробывал так сделать. Тогда просиходит следующее.
Письмо уходит, в телеграм сообщение падает, а на этой строчки скрипт прерывается. Алерт тоже не выходит. Браузер показывает предупреждение, что ym это не функция.
Ответить с цитированием
  #4 (permalink)  
Старый 30.04.2020, 18:39
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,714

Сообщение от alshanskiy
что ym это не функция.
У вас должен быть подключен к странице код счётчика, в котором определена та самая функция ym

Код счётчика выглядит так..
<!-- Yandex.Metrika counter -->
<script type="text/javascript" >
   (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
   m[i].l=1*new Date();k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
   (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");

   ym(XXXXXX, "init", {
        clickmap:true,
        trackLinks:true,
        accurateTrackBounce:true
   });
</script>
<noscript><div><img src="https://mc.yandex.ru/watch/XXXXXX" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->


Свой код с правильным ключом вы можете найти у себя на странице в Яндекс метрике — https://metrika.yandex.ru/list/

Последний раз редактировалось Malleys, 30.04.2020 в 18:44.
Ответить с цитированием
  #5 (permalink)  
Старый 30.04.2020, 19:05
Новичок на форуме
Отправить личное сообщение для alshanskiy Посмотреть профиль Найти все сообщения от alshanskiy
 
Регистрация: 30.04.2020
Сообщений: 3

Код установлен. Так как до этого цель приходила. Мы просто ее перенсли их тега <form> в 43 строчку как вы и сказали.

Если я переношу так, как вы написали:

success: function(res){
                                                 if( res == 1 ){
                                                     $('#zakaz-seychas').find('input, textarea').removeClass("danger");
                                                     $('#zakaz-seychas').find('input, textarea').addClass("succses");
                                                     $('#zakaz-seychas').find('input:not(#submit), textarea').val('');
                                                     $('#submit').next().empty();
                                                     $('#sending').modal('hide');
                                                     ym(XXXXXXXX, 'reachGoal', 'zakaz_top');
                                                     alert('Письмо успешно отправлено');
                                                     $('#zakaz-seychas').find('input, textarea').removeClass("succses"); 
                                                 }else{
                                                     $('#submit').next().empty();
                                                     alert('Ошибка 1049');
                                                 }
                                             },


То тогда форма отпраляется, алерт выходит, но цель не доходит.
А если я ставлю строчку полностью:

success: function(res){
                                                 if( res == 1 ){
                                                     $('#zakaz-seychas').find('input, textarea').removeClass("danger");
                                                     $('#zakaz-seychas').find('input, textarea').addClass("succses");
                                                     $('#zakaz-seychas').find('input:not(#submit), textarea').val('');
                                                     $('#submit').next().empty();
                                                     $('#sending').modal('hide');
                                                     ym(XXXXXXXX, 'reachGoal', 'zakaz_top') return true;
                                                     alert('Письмо успешно отправлено');
                                                     $('#zakaz-seychas').find('input, textarea').removeClass("succses"); 
                                                 }else{
                                                     $('#submit').next().empty();
                                                     alert('Ошибка 1049');
                                                 }
                                             },


то браузер выдает такую ошибку:

Код:
SyntaxError: unexpected token: keyword 'return'
где то ошибка в синтаксисе.
Ответить с цитированием
  #6 (permalink)  
Старый 30.04.2020, 19:33
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

https://yandex.ru/support/metrica/code/ajax-flash.html
Ответить с цитированием
  #7 (permalink)  
Старый 30.04.2020, 19:42
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,714

Сообщение от alshanskiy
Если я переношу так, как вы написали:
Примерная задержка по передачи данных составляет 15-20 минут. Иногда до 60 минут. Когда вы перейдете в отчет Конверсии, то увидите, что данные по цели передались.

Сообщение от alshanskiy
SyntaxError: unexpected token: keyword 'return'
Так не правильно. Первый вариант в вашем сообщении выше правильный.

Сообщение от laimas
https://yandex.ru/support/metrica/code/ajax-flash.html
Автор не делает сайт в Macromedia Flash, swf. Это широко распространённая практика?

И тем более код для цели указан при создании цели...



Я проверил, достигнутая цель отображается в метрике примерно через полчаса!

Последний раз редактировалось Malleys, 30.04.2020 в 19:58. Причина: Я проверил, достигнутая цель отображается в метрике примерно через полчаса!
Ответить с цитированием
  #8 (permalink)  
Старый 30.04.2020, 20:48
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от Malleys
Автор не делает сайт в Macromedia Flash, swf. Это широко распространённая практика?
Что в придурка играть будем или знаний не хватает прочесть все, кроме Flash?
Ответить с цитированием
  #9 (permalink)  
Старый 01.05.2020, 19:30
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,714

laimas, комментарий не читай, одно слово вылавливай.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Почему не достигаются цели в яндекс метрике? giwuf Общие вопросы Javascript 2 01.04.2019 18:39
Отправка формы после ajax проверки ShutTap Общие вопросы Javascript 15 08.04.2016 11:46
Отправка данных формы. Как выглядит структура метода с AJAX (по JQuery)? Coriolan161 AJAX и COMET 5 24.11.2015 20:17
Не работает отправка события в Гугла аналитику и Яндекс метрику SergeyPetrovA Общие вопросы Javascript 9 30.08.2015 15:43
Отправка данных формы AJAX`ом? Jopses jQuery 4 20.02.2013 12:34