В последней версии 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
:
Тем не менее, их максимальная длина составляет до 9 символов, что будет даже больше MM/YYYY
:
Я попытался изменить 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
.
требуется много работы.
Как изменить максимальную длину поля?