Shopify Подтвердите выдачу пароля из-за g-recaptcha - PullRequest
Новая
       92

Shopify Подтвердите выдачу пароля из-за g-recaptcha

0 голосов
/ 05 марта 2020

Я создал поле подтверждения пароля на странице регистрации, но столкнулся с проблемой из-за G-challenge, так как перенаправление shopify на страницу вызова после отправки формы и js не работают, которые я использовал для подтверждения пароля. 

 <input type="password" name="customer[password]" id="CreatePassword" class="{% if form.errors contains 'password' %} error{% endif %}" required>
 <input type="password" value="" name="customer[password_confirmation]" id="confirm-password" class="password text {% if form.errors contains 'password' %} error{% endif %}" size="30" required/>



$(function(){
  $('form#create_customer').submit(function(e) {
    e.preventDefault();
    if ( $('#CreatePassword').val() != $('#confirm-password').val()) {
      alert('Passwords do not match.');
    } else {
        $('form#create_customer').submit();
    }
  });
});

1 Ответ

0 голосов
/ 05 марта 2020

Я считаю, что ваш JS код вообще не работает. Если вы всегда будете перенаправлены на страницу reCaptcha, это просто означает, что ваш код jQuery не сработал. Это может произойти, если jQuery либо не включен в вашу тему, либо загрузка скрипта отложена , и вы пытаетесь выполнить свой код перед его загрузкой.

Но даже когда ваш код работает, вы столкнетесь с другой проблемой, когда пароли действительно совпадают - ошибка Maximum call stack size exceeded, если вы используете Chrome ( слишком много рекурсии в Firefox ). Причина в том, что вы всегда предотвращаете поведение отправки по умолчанию в вашем обратном вызове, но также запускаете submit, если пароли одинаковы, что приводит к бесконечному l oop.

См. Переработанный код ниже: должно работать: 

$(function(){
  $('form#create_customer').submit(function(e) {
    if ( $('#CreatePassword').val() != $('#confirm-password').val()) {
      e.preventDefault();
      alert('Passwords do not match.');
    }
  });
});

jQuery загрузка отложена

Как правило, разработчики тем имеют файл (например, assets/vendor.js), в который они добавляют все сторонняя библиотека. Найдите этот файл и убедитесь, что jQuery там. Создайте другой файл, например assets/custom.js, поместите туда свой код. Затем go layout/theme.liquid и найдите, куда включен файл vendor.js. Это может выглядеть примерно так: 

<script src="{{ 'vendor.js' | asset_url }}" defer="defer"></script>

Включите ваш файл с пользовательскими JS после этой строки, чтобы он выглядел примерно так: 

<script src="{{ 'vendor.js' | asset_url }}" defer="defer"></script>
<script src="{{ 'custom.js' | asset_url }}" defer="defer"></script>

jQuery не включено

Включить его

Я не хочу использовать jQuery! 

var createCustomerForm = document.getElementById("create_customer");
var passwordInput = document.getElementById("CreatePassword");
var passwordConfirmInput = document.getElementById("confirm-password");
createCustomerForm.addEventListener("submit", function(e) {
  if (passwordInput.value != passwordConfirmInput.value) {
    e.preventDefault();
    alert('Passwords do not match.');
  }
});

Если вышеупомянутое не помогло, укажите ссылку на ваш сайт.

...