За последние 24 часа нас посетили 21373 программиста и 1085 роботов. Сейчас ищут 784 программиста ...

Вывод popup окна

Тема в разделе "PHP для новичков", создана пользователем Seotime, 6 авг 2024.

  1. Seotime

    Seotime Активный пользователь

    С нами с:
    12 май 2021
    Сообщения:
    12
    Симпатии:
    0
    Прошу помощи с выводом popup окна.
    Подробнее. Есть сайт jetour.seotime.su. Есть три формы сверху. По клику в форме срабатывает js и вызывается order.php, который передаёт значения true и выводится скрытый div (popup__thanks-bg). Верхние три пункта работают, я вот нижний (после ответов на вопросы) - нет, хотя такая же логика.
    order.php
    PHP:
    1. {"success":true}
     
  2. Vladimir Kheifets

    Vladimir Kheifets Новичок

    С нами с:
    23 сен 2023
    Сообщения:
    339
    Симпатии:
    67
    Адрес:
    Бавария, Германия
    Добрый день!
    Покажите, пожалуйста, коды HTML, JS и order.php.
    Удачи!
     
  3. Seotime

    Seotime Активный пользователь

    С нами с:
    12 май 2021
    Сообщения:
    12
    Симпатии:
    0
    order.php выше указал
    HTML верхняя форма
    HTML:
    1. <div class="advantages">
    2.                     <div class="advantage" id="1">
    3.                         <div class="advantageimg ai3"></div>
    4.                         <div class="advantagetext">Записаться на тест-драйв</div>
    5.                     </div>
    6.                     <div class="advantage" id="2">
    7.                         <div class="advantageimg ai1"></div>
    8.                         <div class="advantagetext">Специальные программы кредитования</div>
    9.                     </div>
    10.                     <div class="advantage" id="3">
    11.                         <div class="advantageimg ai2"></div>
    12.                         <div class="advantagetext">КАСКО в подарок<span class="priceinfo2"></span></div>
    13.                        
    14.                     </div>
    15.                 </div>
    16.  
    HTML нижняя форма
    HTML:
    1. <div class="blockpopup__bg">
    2.         <div class="blockpopup">
    3.             <div class="blockpopup__close"></div>
    4.             <div class="blockpopup__add chatheader">
    5.                 <div class="blockpopup__add-img"></div>
    6.                 <div class="blockpopup__add-text">
    7.                     <div class="konsul__name">Ольга</div>
    8.                     <div class="konsul_pos">Онлайн-консультант автосалона JETOUR</div>
    9.                 </div>
    10.             </div>
    11.             <div class="blockpopup__chat">
    12.                 <div class="msgpopup"></div>
    13.                
    14.                 <div class="blockpopup__chat-msg mestext msgPurchase"></div>
    15.                 <div class="msgpopup butslink">
    16.                     <input class="inptext popup_phone" type="tel" placeholder="+7 (___) ___-__-__">
    17.                     <div class="divbutphone"><button class="butpopup">Отправить</button>
    18.                         <div class="error errorphone"></div>
    19.                     </div>
    20.                     <div class="popup_policy">Отправляя форму, Вы соглашаетесь<br>с <a href="./policy.pdf" target="_blank">политикой конфиденциальности</a></div>
    21.                 </div>
    22.             </div>
    23.         </div>
    24.     </div>
    25.     <div class="popup__thanks-bg">
    26.         <div class="popup__thanks">
    27.             <div class="blockpopup__close"></div>
    28.             <div class="popup__thanks-img icosuccess"></div>
    29.             <div class="popup__thanks-title smshead">Спасибо!</div>
    30.             <div class="popup__thanks-desc smsdesc">Ваша заявка принята <br> Мы скоро свяжемся с Вами.</div>
    31.         </div>
    32.     </div>
    33.  
    34.  
    Во первое что пришло - нижний html одернуть класом advantages
     
  4. Vladimir Kheifets

    Vladimir Kheifets Новичок

    С нами с:
    23 сен 2023
    Сообщения:
    339
    Симпатии:
    67
    Адрес:
    Бавария, Германия
    Остались проблемы с пониманием.
    Вы не показали JS, а проблема у Вас в обработчике события Click.
    Это не понятно: нижний html одернуть класом advantages
    То что Вы называете "форма" на самом деле вложенные <div> блоки.
    HTML форма должна быть в тэгах <form></form>
    В order.php у Вас не PHP-код. Всё может прояснится, когда покажите JS.
     
  5. Vladimir Kheifets

    Vladimir Kheifets Новичок

    С нами с:
    23 сен 2023
    Сообщения:
    339
    Симпатии:
    67
    Адрес:
    Бавария, Германия
    (дополнение)
    Не дождался от Вас JS. Посмотрел jetour.seotime.su в браузере. JS посмотреть не удалось(сжат).
    Увидел несколько накладок в Ваших popup см. скриншот.
    1. Не видна закрывашка обычно бывает html символ &times; , но у Вас img и он не виден.
    Код (Text):
    1. <div class="blockpopup__close"></div>
    2. После </div> выводится -->
    Код (Text):
    1.   <div class="blockpopup__chat-msg msgpopup mestext">Здравствуйте!<br> Напишите свой номер и я подробно расскажу обо всех доступных преимуществах от Jetour и нашего салона.</div>
    2.   -->
    3.   <div class="blockpopup__chat-msg mestext msgPurchase">Здравствуйте!<br>Напишите свой номер и я подробно расскажу обо всех доступных преимуществах от JETOUR, нашего салона и запишу Вас на тест-драйв!</div>
    Возможно <div class="blockpopup__chat-msg msgpopup mestext"> был закоментирован.
    повторяться не должно.
    Этот div м.б. вообще убрать или добавить перед ним <!--
    Код (Text):
    1.  
    2. <!--
    3. <div class="blockpopup__chat-msg msgpopup mestext">Здравствуйте!<br> Напишите свой номер и я подробно расскажу обо всех доступных преимуществах от Jetour и нашего салона.</div>
    4. -->
    5.  
    6. <div class="blockpopup__chat-msg mestext msgPurchase">Здравствуйте!<br>Напишите свой номер и я подробно расскажу обо всех доступных преимуществах от JETOUR, нашего салона и запишу Вас на тест-драйв!</div>
     

    Вложения:

    • Screenshot.jpg
      Screenshot.jpg
      Размер файла:
      251,1 КБ
      Просмотров:
      3
    #5 Vladimir Kheifets, 6 авг 2024
    Последнее редактирование: 6 авг 2024
  6. Seotime

    Seotime Активный пользователь

    С нами с:
    12 май 2021
    Сообщения:
    12
    Симпатии:
    0
    Спасибо.
     
  7. Vladimir Kheifets

    Vladimir Kheifets Новичок

    С нами с:
    23 сен 2023
    Сообщения:
    339
    Симпатии:
    67
    Адрес:
    Бавария, Германия
    Добрый день!
    Посмотрел внимательно сайт в браузере.
    У Вас JS есть файл script1.js и в нём обработчики события "click" по кнопки "Отправить"
    Как я написал раньше, у Вас нет HTML-form и обработков события "submit".
    Для ввода данных применяется тэги input и checbox(в нижней "форме").
    В обработчиках, данные выбираются по селекторам из ДОМ-элэментов соответствущих тэгов.

    После валидации данных, отправлются два запроса:
    - функцией sendRequestToCalltouch на API api.calltouch.ru
    - ajax POST-Request на url: 'order.php',

    В order.php данные как-то обрабатывают и возвращается JSON-Response, c значение success true или false.
    То, что Вы показали как PHP-код на самом деле воозвращаемый результат order.php.

    Почему же нижний (после ответов на вопросы) - нет, хотя такая же логика?
    Потому, что локика отличается.

    В обработчике трёх первых/верхних "форм" (см. код 1) для отправки запросов вызывается функция sendorderForm(),
    в нижней "форме" (см. код 2) функция sendorder().

    Подозреваю, что в поледнем случае order.php возвращает false.
    Возможно, что во всех случаях должна вызываться функция sendorderForm() или что-то
    нужно подкрутить в функции sendorder() или в order.php.

    1.
    Код (Javascript):
    1. function() {
    2.   const elem = $(this);
    3.   $('.popup_name').removeClass('inperror');
    4.   $('.popup_phone').removeClass('inperror');
    5.   $(this).html('Отправить').removeAttr('style');
    6.   var phone = $('.popup_phone').val();
    7.   var name = $('.popup_name').val();
    8.   var phone2 = $('.popup_phone').val().replace(/\D+/g, '');
    9.   var count = phone2.length;
    10.   if (phone != '' && count == 11 && name != '') {
    11.   if (
    12.   phone2.indexOf('00000') == -1 &&
    13.   phone2.indexOf('11111') == -1 &&
    14.   phone2.indexOf('22222') == -1 &&
    15.   phone2.indexOf('33333') == -1 &&
    16.   phone2.indexOf('44444') == -1 &&
    17.   phone2.indexOf('55555') == -1 &&
    18.   phone2.indexOf('66666') == -1 &&
    19.   phone2.indexOf('77777') == -1 &&
    20.   phone2.indexOf('88888') == -1 &&
    21.   phone2.indexOf('99999') == -1
    22.   )
    23.   {
    24.   if (!elem.hasClass('disabled')) {}
    25.   elem.css('width', $('.butphone').outerWidth()).addClass('disabled').html('<div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div>');
    26.   sendorderform();
    27.   }
    28.   else $('.popup_phone').addClass('inperror');
    29.   }
    30.   else if (phone == '')
    31.   {
    32.   $('.popup_phone').addClass('inperror');
    33.   }
    34.   else if (name == '')
    35.   {
    36.   $('.popup_name').addClass('inperror');
    37.   }
    38. }
    2.
    Код (Javascript):
    1. function() {
    2.   const elem = $(this);
    3.   $('.errorphone').hide().html('');
    4.   $('.inpphone').removeClass('inperror');
    5.   $(this).html('Все верно?').removeAttr('style');
    6.   if ($(this).hasClass('butphoneshow')) {
    7.   if (!$(this).hasClass('butlinkdisable') && !$(this).hasClass('butlinkdisable2')) {
    8.   let phone = elem.closest('.butslink').find('.inpphone');
    9.   let phoneVal = phone.val();
    10.   let phoneNum = phone.val().replace(/\D+/g, '');
    11.   let phoneLen = phoneNum.length;
    12.   let name = elem.closest('.butslink').find('.inpname');
    13.   let nameVal = name.val();
    14.  
    15.   if (!phoneVal && phoneLen >= 10) {
    16.   phone.addClass('inperror');
    17.   }
    18.   else if (!nameVal) {
    19.   name.addClass('inperror');
    20.   }
    21.   else {
    22.   if (
    23.   phoneNum.indexOf('00000') == -1 &&
    24.   phoneNum.indexOf('11111') == -1 &&
    25.   phoneNum.indexOf('22222') == -1 &&
    26.   phoneNum.indexOf('33333') == -1 &&
    27.   phoneNum.indexOf('44444') == -1 &&
    28.   phoneNum.indexOf('55555') == -1 &&
    29.   phoneNum.indexOf('66666') == -1 &&
    30.   phoneNum.indexOf('77777') == -1 &&
    31.   phoneNum.indexOf('88888') == -1 &&
    32.   phoneNum.indexOf('99999') == -1
    33.   ) {
    34.   if (!elem.hasClass('disabled')) {
    35.   $('.butphone').css('width', $('.butphone').outerWidth()).addClass('disabled').html('<div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div>');
    36.   // ym(94769901, 'reachGoal', 'nomer');
    37.  
    38.   sendorder();
    39.   }
    40.   }
    41.   else $('.inpphone').addClass('inperror');
    42.   }
    43.   }
    44.   }
    45. }
    Удачи!
     
    #7 Vladimir Kheifets, 8 авг 2024
    Последнее редактирование: 8 авг 2024