good_br
@good_br
учусь

Как подключить popup форму и обработчик к ней?

Доброй ночи! ситуация такая, я пытаюсь скопировать код сайта с конструктора тильда , но там есть всплывающие окна popup , они по началу не работали , потом я подключил к ним JQuery и подключил скрипт .
Я новичок, поэтому прошу простыми словами объяснить , спасибо!

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <!--подключил  JQuery--> 
<!--подключение скрипта -->
<script>
    $(document).ready(function(){
        //Скрыть PopUp при загрузке страницы    
        PopUpHide();
    });
    //Функция отображения PopUp
    function PopUpShow(){
        $("#popup1").show();
    }
    //Функция скрытия PopUp
    function PopUpHide(){
        $("#popup1").hide();
    }
</script>


Вопрос такой , как мне подключить обработчик на php , пробовал прописывать в action , но не получилось

Ниже код формы :
<form id="form83519980" name='form83519980' role="form" action='index.html' method='POST' data-formactiontype="2" data-inputbox=".t-input-group"  data-success-url="https://www.pickup.botadd.ru/thanks" class="t-form js-form-proccess t-form_inputs-total_3"  data-success-callback="t720_onSuccess"  >
	
	  			        	            	                <input type="hidden" name="formservices[]" value="7c2909ae393125339c0a5220f326bf8b" class="js-formaction-services">
	            	                <input type="hidden" name="formservices[]" value="bb768291fca5aad48a2d7f637014d246" class="js-formaction-services">
	            	        
            
            <div class="js-successbox t-form__successbox t-text t-text_md" style="display:none;">Спасибо! Данные успешно отправлены</div>

            <div class="t-form__inputsbox">

				
            <div class="t-input-group t-input-group_nm" data-input-lid="1496398308530">
                              <div class="t-input-block">
                          <input type="text" name="Name" class="t-input js-tilda-rule " value="" placeholder="Имя" data-tilda-req="1" data-tilda-rule="name" style="color:#ffffff; border:1px solid #ffffff;  ">
                    <div class="t-input-error"></div>
          </div>
      </div>


            <div class="t-input-group t-input-group_em" data-input-lid="1509715109349">
                              <div class="t-input-block">
                          <input type="text" name="Email" class="t-input js-tilda-rule " value="" placeholder="E-mail"  data-tilda-rule="email" style="color:#ffffff; border:1px solid #ffffff;  ">
                    <div class="t-input-error"></div>
          </div>
      </div>


            <div class="t-input-group t-input-group_ph" data-input-lid="1509715118955">
                              <div class="t-input-block">
          		  	                   		<input type="tel" name="Phone" class="t-input js-tilda-rule js-tilda-mask " value="" placeholder="+7 " data-tilda-req="1" data-tilda-rule="phone" pattern="[0-9]*" data-tilda-mask="+7 (999) 999-9999" style="color:#ffffff; border:1px solid #ffffff;  ">
                                    <div class="t-input-error"></div>
          </div>
      </div>





				<div class="t-form__errorbox-middle">
					                <div class="js-errorbox-all t-form__errorbox-wrapper" style="display:none;">
                    <div class="t-form__errorbox-text t-text t-text_md">
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-all"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-req"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-email"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-name"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-phone"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-minlength"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-string"></p>
                    </div>
                </div>				</div>

                <div class="t-form__submit">
                    <button type="submit" class="t-submit" style="color:#ffffff;background-color:#f5914f;border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;" >ОСТАВИТЬ ЗАЯВКУ</button>
                </div>

            </div>

            <div class="t-form__errorbox-bottom">
            	                <div class="js-errorbox-all t-form__errorbox-wrapper" style="display:none;">
                    <div class="t-form__errorbox-text t-text t-text_md">
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-all"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-req"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-email"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-name"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-phone"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-minlength"></p>
                        <p class="t-form__errorbox-item js-rule-error js-rule-error-string"></p>
                    </div>
                </div>            </div>


    </form>


Так я подключил js скрипт , после чего форму начали работать .
<div class="t-popup" data-tooltip-hook="javascript:PopUpShow()"  >


Так же есть файл js (https://pickup.botadd.ru/1/tilda-zero-forms-1.0.min.js) в котором прописан путь до обработчика https://forms.tildacdn.com/procces/
,но когда я меняю адрес до своего скрипта , то работать он отказывается
  • Вопрос задан
  • 1159 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
25 нояб. 2024, в 18:18
20000 руб./за проект
25 нояб. 2024, в 18:00
5000 руб./за проект
25 нояб. 2024, в 17:47
5000 руб./за проект