PHP.SU

Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Без описания
Doox911
Отправлено: 12 Апреля, 2018 - 17:33:47
Post Id



Частый гость


Покинул форум
Сообщений всего: 144
Дата рег-ции: Сент. 2011  


Помог: 0 раз(а)




Создаю форму через плагин contact form 7. Добавляю её на страницу. Получается код:
CODE (html):
скопировать код в буфер обмена
  1. <form action="/product/stoika-pribornaya-standart/#wpcf7-f2383-p438-o1" method="post" class="wpcf7-form" novalidate="novalidate">
  2. <div style="display: none;">
  3. <input type="hidden" name="_wpcf7" value="2383">
  4. <input type="hidden" name="_wpcf7_version" value="5.0.1">
  5. <input type="hidden" name="_wpcf7_locale" value="ru_RU">
  6. <input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f2383-p438-o1">
  7. <input type="hidden" name="_wpcf7_container_post" value="438">
  8. </div>
  9. <p><label class="label-kp"> Ваше имя<br>
  10.     <span class="wpcf7-form-control-wrap your-name"><input type="text" name="your-name" value="" size="40" class="wpcf7-form-control wpcf7-text your-name" id="your-name" aria-invalid="false" placeholder="Иммануил Кант"></span> </label></p>
  11. <p><label class="label-kp"> Номер телефона<br>
  12.     <span class="wpcf7-form-control-wrap phone"><input type="tel" name="phone" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-tel wpcf7-validates-as-tel phone" id="phone" aria-invalid="false" placeholder="+7(___) ___-____"></span> </label></p>
  13. <p><label class="label-kp"> Ваш e-mail<br>
  14.     <span class="wpcf7-form-control-wrap your-email"><input type="email" name="your-email" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-email your-email" id="your-email" aria-invalid="false" placeholder="supermail@mail.ru"></span> </label></p>
  15. <div class="wpcf7-form-control-wrap"><div data-sitekey="6LfEY1IUAAAAAG5MMzzAC-cjMEqZrqICemxfp9oH" class="wpcf7-form-control g-recaptcha wpcf7-recaptcha recaptcha-kp"><div style="width: 304px; height: 78px;"><div><iframe src="https://www.google.com/recaptcha/api2/anchor?k=6LfEY1IUAAAAAG5MMzzAC-cjMEqZrqICemxfp9oH&co=aHR0cDovL2VuZG8tbWVkaWNhbC5ydTo4MA..&hl=ru&v=v1522970272143&size=normal&cb=lufu46oat1e3" width="304" height="78" role="presentation" frameborder="0" scrolling="no" sandbox="allow-forms allow-popups allow-same-origin allow-scripts allow-top-navigation allow-modals allow-popups-to-escape-sandbox"></iframe></div><textarea id="g-recaptcha-response" name="g-recaptcha-response" class="g-recaptcha-response" style="width: 250px; height: 40px; border: 1px solid #c1c1c1; margin: 10px 25px; padding: 0px; resize: none;  display: none; "></textarea></div></div>
  16. <noscript>
  17.         <div style="width: 302px; height: 422px;">
  18.                 <div style="width: 302px; height: 422px; position: relative;">
  19.                         <div style="width: 302px; height: 422px; position: absolute;">
  20.                                 <iframe src="https://www.google.com/recaptcha/api/fallback?k=6LfEY1IUAAAAAG5MMzzAC-cjMEqZrqICemxfp9oH" frameborder="0" scrolling="no" style="width: 302px; height:422px; border-style: none;">
  21.                                 </iframe>
  22.                         </div>
  23.                         <div style="width: 300px; height: 60px; border-style: none; bottom: 12px; left: 25px; margin: 0px; padding: 0px; right: 25px; background: #f9f9f9; border: 1px solid #c1c1c1; border-radius: 3px;">
  24.                                 <textarea id="g-recaptcha-response" name="g-recaptcha-response" class="g-recaptcha-response" style="width: 250px; height: 40px; border: 1px solid #c1c1c1; margin: 10px 25px; padding: 0px; resize: none;">
  25.                                 </textarea>
  26.                         </div>
  27.                 </div>
  28.         </div>
  29. </noscript>
  30. </div>
  31. <p><input type="submit" value="Запросить предложение" class="wpcf7-form-control wpcf7-submit round"><span class="ajax-loader"></span></p>
  32. <div class="wpcf7-response-output wpcf7-display-none"></div></form>


Далее при помощи плагина Inputmask добавляю маску к полям:

CODE (javascript):
скопировать код в буфер обмена
  1. (function(jQuery){
  2.         jQuery(function(){
  3.                 jQuery('.woocommerce-grouped-product-list-item__quantity').remove();
  4.  
  5.                 $('#phone').inputmask({"mask": "+7(999) 999-9999"});
  6.                 $('#your-email').inputmask({
  7.             mask: "*{1,20}[.*{1,20}][.*{1,20}][.*{1,20}]@*{1,20}[.*{2,6}][.*{1,2}]",
  8.             greedy: false,
  9.             onBeforePaste: function (pastedValue, opts) {
  10.               pastedValue = pastedValue.toLowerCase();
  11.               return pastedValue.replace("mailto:", "");
  12.             },
  13.             definitions: {
  14.               '*': {
  15.                 validator: "[0-9A-Za-z!#$%&'*+/=?^_`{|}~\-]",
  16.                 cardinality: 1,
  17.                 casing: "lower"
  18.               }
  19.             }
  20.           });
  21.     });
  22. })(jQuery);


В поле емаил ничего не происходит. Может я что-то не понимаю. Подскажите пожалуйста.
 
 Top
Sail
Отправлено: 08 Мая, 2018 - 22:39:39
Post Id



Участник


Покинул форум
Сообщений всего: 1131
Дата рег-ции: Февр. 2014  


Помог: 57 раз(а)




Doox911 пишет:
В поле емаил ничего не происходит

Может, в консоли js (инструменты разработчика в браузере) ошибку какую-нибудь пишет?
PS: Код для email-маски брали из Usage?
На что влияет "cardinality: 1,"?
 
 Top
Doox911
Отправлено: 15 Мая, 2018 - 09:14:01
Post Id



Частый гость


Покинул форум
Сообщений всего: 144
Дата рег-ции: Сент. 2011  


Помог: 0 раз(а)




Sail пишет:
Doox911 пишет:
В поле емаил ничего не происходит

Может, в консоли js (инструменты разработчика в браузере) ошибку какую-нибудь пишет?
PS: Код для email-маски брали из Usage?
На что влияет "cardinality: 1,"?

Ошибок нет. Про код для email. Да.
Честно говоря, забыл. Сейчас емаил работает. А вот поле с маской под телефон, после отправки формы пропадает). Код не изменился.

Решение:
1. Поле с телефоном необходимо брать по id.
2. Поле с типом email не поддерживается. Подробнее об этом баге в на гите.

(Отредактировано автором: 15 Мая, 2018 - 12:47:27)

 
 Top
Страниц (1): [1]
Сейчас эту тему просматривают: 1 (гостей: 1, зарегистрированных: 0)
« JavaScript & VBScript »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
 



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB