Multiple instances on the same page won't work

[fballiano]

Hi,
I'm integrating Altcha into an open source ecommerce platform but in some cases I may need 2 instances of the captcha in the same page (eg: checkout page has captcha on the checkout form but there's also the newsletter subscription form in the footer which also should have captcha), but unfortunately the first element that triggers the captcha activation "wins" and it's not possible to have another captcha.

Is this something that could be implemented in the future? Or is there a workaround I could use? I couldn't find any documentation on how to insert/remove a captcha programmatically via javascript.

Thanks!

[fballiano]

I've used a workaround using the statechange event this way

document.querySelector('altcha-widget').addEventListener('statechange', (ev) => {
    try {
        let payload = ev.detail.payload;
        document.querySelectorAll(form).forEach(form => {
            let hiddenInput = form.querySelector('input[name="NAMEOFTHEALTCHAINPUT"]');
            if (!hiddenInput) {
                hiddenInput = document.createElement('input');
                hiddenInput.setAttribute('type', 'hidden');
                hiddenInput.setAttribute('name', 'NAMEOFTHEALTCHAINPUT');
                form.appendChild(hiddenInput);
            }

            hiddenInput.value = payload;
        });
    } catch (e) {}
});

[ovx]

Hi, It is possible to use multiple instances of the ALTCHA widget on the same simply by using a different name for each instance (using the name attribute).

[ekrokowski]

It works fine with multiple instances on the same page if they have a unique name for each instance.

[fballiano]

Hi everybody, thanks for these answers, unfortunately I use a single backend validation function which expects the name to always be the same.

Since input names don't have to be unique I thought we could have used an id instead.