Html Question posted in
Some basic documentation can be found here.

Html – How can I have this specific class of button redirect when clicked/enter, while keeping the original functionality?

I have this button on a novalidate html form and I’m trying to get it to redirect to another webpage, while keeping the original functionality of creating an account.

<button class="yWSHVqDY3QXtLSenwRoA" data-test="create-account-create-button" type="submit"><span>Create account</span></button>

The end goal is for when a user creates an account, the button automatically redirects them to a payment page. I’m super new to coding, so I’m not sure if this is possible, but any help is appreciated!

Tags:

2

Answers


  1. 0

    click and keydown event listeners to your rescue.

    const btn = document.querySelector('.yWSHVqDY3QXtLSenwRoA')
btn.addEventListener('click', () => location.href = 'https://google.com')
btn.addEventListener('keydown', (e) => {
  if (e.key == 'Enter') {
    location.href = 'https://google.com'
  }
})
    <button class="yWSHVqDY3QXtLSenwRoA" data-test="create-account-create-button" type="submit"><span>Create account</span></button>
    Login or Signup to reply.
  2. 0

    In a form you would use the action attribute to specify where the form submit to.

    <form action="/create_account" method="get">
  <button class="yWSHVqDY3QXtLSenwRoA"
    data-test="create-account-create-button" type="submit">
    <span>Create account</span>
  </button>
</form>

    If you have more buttons in the same form you can use the formaction attribute on the button to override the default:

    <form action="/login" method="get">
  <button class="yWSHVqDY3QXtLSenwRoA" formaction="/create_account"
  data-test="create-account-create-button" type="submit">
    <span>Create account</span>
  </button>
  <button type="submit">Login</button>
</form>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search