Getting the following error after updating to beta-2:
DropinUi.js?v=1675350836:26 Uncaught TypeError: Cannot read properties of null (reading 'value')
at DropinUi.js?v=1675350836:26:53
at NodeList.forEach (<anonymous>)
at init (DropinUi.js?v=1675350836:23:37)
at check (DropinUi.js?v=1675350836:16:4)
at DropinUi.js?v=1675350836:20:4
at DropinUi.js?v=1675350836:187:3
This error is occurring because there are other forms on our payment page and DropinUi.js is trying to access .value attributes on a query that hasn't returned an element.
Because payment forms must now be namespaced, there's a different way the variables in DropinUi.js could be populated without having to loop through every form element in the page. If you were to add data-handle="{{ gateway.handle }} to the drop-in UI element in dropin-ui.twig, you would then be able to use the handle to access the necessary elements directly in DropinUi.js, e.g.
amount = document.querySelector('[name="paymentForm[' + $dropinUi.dataset.handle + '][amount]"]').value
jmauzyk
commented
1 year ago
Getting the following error after updating to
beta-2:This error is occurring because there are other forms on our payment page and
DropinUi.jsis trying to access.valueattributes on a query that hasn't returned an element.Because payment forms must now be namespaced, there's a different way the variables in
DropinUi.jscould be populated without having to loop through every form element in the page. If you were to adddata-handle="{{ gateway.handle }}to the drop-in UI element indropin-ui.twig, you would then be able to use the handle to access the necessary elements directly inDropinUi.js, e.g.amount = document.querySelector('[name="paymentForm[' + $dropinUi.dataset.handle + '][amount]"]').value