Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Hash change problem when clicking checkbox #32

Open
clifgriffin opened this issue Jul 3, 2019 · 3 comments
Open

Hash change problem when clicking checkbox #32

clifgriffin opened this issue Jul 3, 2019 · 3 comments

Comments

@clifgriffin
Copy link

@clifgriffin clifgriffin commented Jul 3, 2019

We produce a plugin for WooCommerce that replaces the checkout page with a multistep tabbed interface. (https://www.checkoutwc.com)

We're having an issue with the wrapping anchor for the CO2OK checkbox:

<a href="#!" input="" type="button" role="button" tabindex="0" style="outline: none; -webkit-appearance: none;" class="co2ok_nolink">...</a>

When checking the box, the hash changes to #! which resets the tab position.

We have temporarily worked around it with this:

        jQuery( document.body ).on( 'cfw_updated_checkout', function() {
            jQuery( 'a.co2ok_nolink' ).prop('href', '#cfw-payment-method' );
        } );

But ultimately, this could be fixed more easily by either not using an anchor as the wrapper (seems unnecessary) or by suppressing the default action. (We tried e.preventDefault() but had issues. It's possible an onClick attribute that returns false could fix this.

Let me know if I haven't provided enough information.

Thanks!

@Mil0dV

This comment has been minimized.

Copy link
Owner

@Mil0dV Mil0dV commented Jul 8, 2019

IIRC this was done for A11Y, specifically making the checkbox keyboard operable. Briefly reading about it makes me think we could have just used , but pretty sure we also looked at https://formidable.com/blog/2014/05/08/anchors-buttons-and-accessibility/ while adding A11Y.

I'll look into this soon. Could you perhaps provide me with a way to test with checkoutwc?

@clifgriffin

This comment has been minimized.

Copy link
Author

@clifgriffin clifgriffin commented Jul 8, 2019

Sure, what's your email address?

@Mil0dV

This comment has been minimized.

Copy link
Owner

@Mil0dV Mil0dV commented Jul 22, 2019

milo [at] co2ok.eco

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
2 participants
You can’t perform that action at this time.