переопределить поле ввода Braintree maxlength - PullRequest
Новая
       15

переопределить поле ввода Braintree maxlength

0 голосов
/ 01 мая 2019

В последней версии Braintree JS SDK (v3) вы можете переопределить стили и некоторые параметры поля, например, placeholder через 

braintree.dropin.create({
  authorization: 'CLIENT_AUTHORIZATION',
  container: '#dropin-container',
  card: {
    overrides: {
      fields: {
        number: {
          placeholder: 'Card Number',
          formatInput: false // Turn off automatic formatting
        }
      }
    }
  }
}, /* ... */);

Вместо стилей или заполнителей мне нужно изменить поле maxlength.

По какой-то причине в их раскрывающемся поле истечения срока действия отображается как MM/YY:

enter image description here

Тем не менее, их максимальная длина составляет до 9 символов, что будет даже больше MM/YYYY:

enter image description here

Я попытался изменить maxlength на 5 несколькими способами, но не повезло:

1) переопределить через свой SDK

(обратите внимание, переопределение placeholder работает, но maxlength не работает): 

overrides: {
    fields: {
        expirationDate: {
            maxlength: 5
        }
    }
}

2) Переопределить сам элемент 

let expDateField = $(`[data-braintree-name='expirationDate']`);
expDateField.attr('maxlength', 5);

3) Тогда я понял, что это может быть потому, что это происходит через iFrame. Поэтому я попытался настроить таргетинг через iFrame и: 

let iFrame = document.getElementById('braintree-hosted-field-expirationDate');
let content = i.contentWindow.document;

Результаты с ошибкой:

Uncaught DOMException: заблокирован кадр с источником "http://localhost:1337" от доступа к фрейму перекрестного происхождения. в: 1: 25

Эта ошибка, вероятно, имеет смысл, поскольку они хотят, чтобы безопасные https: источники только манипулировали данными iFrame. Но, тем не менее, кажется, что для изменения maxlength.

требуется много работы.

Как изменить максимальную длину поля?

...