Отключить кнопку формы тега привязки в виджете Okta - PullRequest
Новая
       36

Отключить кнопку формы тега привязки в виджете Okta

0 голосов
/ 27 сентября 2019

Я использую виджет Okta на пользовательском домене.Я выполняю некоторые незначительные изменения после того, как виджет рендерится с использованием события afterrender. Смотрите после события рендера здесь .Все работает нормально, кроме одной модификации, которая пытается проверить, правильно ли пользователь ввел адрес электронной почты в формате, прежде чем сбросить или разблокировать свою учетную запись.(Okta не предоставляет этого и позволит пользователю отправлять jibberish).

Проблема в том, что я могу отключить кнопку тега привязки и изменить ее поведение, пока она ожидает ввода правильного адреса электронной почты: <a data-se="email-button" class="button button-primary button-wide email-button link-button" href="#">Reset via Email</a>

Я могу добавить к щелчкуфункциональность события, но я не могу приостановить его поведение.Я пытался:

  1. остановка распространения
  2. предотвратите ошибку по умолчанию
  3. .prop ('отключен', true)
  4. .attr ('отключен', 'disabled ');

В режиме просмотра Chrome я попытался удалить все атрибуты тега привязки, и он все еще отправляет кнопку формы.Что сработало, так это если я временно изменил тег привязки на тег ap, а затем снова изменил его.Но когда это было сделано в коде с помощью .replacewith (...) или .after (...). Remove (), функция отправки не работала правильно с тегом и формой.Он просто вернулся на главный экран входа в систему и не отправляет электронное письмо, даже если адрес связан с учетной записью.

Вот текущий код, в котором я тестировал предотвращение дефолта (.after (...).попытки удаления () закомментированы).Эта функция запускается при визуализации контроллера разблокировки или сброса.Журнал консоли для события click запускается здесь, но предотвращение дефолта не работает: 

function addEmailValidation() {
      pString = '<p id="locked-button" data-se="email-button" class="button button-primary button-wide email-button link-button" href="#">Send Email</p>'
      aString = '<a data-se="email-button" class="button button-primary button-wide email-button link-button" href="#">Send Email</a>'
      validationString = "<div id='email-validation-text'>Email Address is Required!</div>"

      // $('a.button').after(pString).remove();

      // $('p.button').click(function (e) {
      //   $("#email-validation-text").remove()
      //   $('div.o-form-fieldset').after(validationString)
      // });

      $("a.button").click(function (event) {
        console.log("a tag click event")
        event.preventDefault();
      });

      $('input[name="username"]').on('input', function () {
        var input = $(this);
        var re = /\b[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}\b/i;
        var is_email = re.test(input.val());
        if (is_email) {
          // $('p.button').after(aString).remove();
          $("#email-validation-text").remove()
        }
        else {
          $("#email-validation-text").remove()
          // $('a.button').after(pString).remove();
          $('div.o-form-fieldset').after(validationString)
        }
      });
    }

Код контроллера учетной записи сброса и разблокировки Okta (React, я думаю?) Можно найти здесь:

  1. Сброс пароля
  2. Учетная запись разблокирована
...