Level 58
To redirect to different pages after submitting the form using the two submit buttons, you can modify the code as follows:
- Remove the
formactionattribute from the first submit button. - Add a
v-on:clickevent listener to the second submit button and call a method that will redirect to the desired page. - In the
member_whitelist_signupmethod, add a conditional statement to check which button was clicked and redirect accordingly.
Here's the modified code:
<template>
<form @submit.prevent="member_whitelist_signup" class="login100-form validate-form">
<!-- form fields here -->
<div class="container-login100-form-btn m-t-20 m-b-10">
<div class="wrap-login100-form-btn" style="z-index: 0">
<div class="login100-form-bgbtn"></div>
<button class="login100-form-btn submit1" type="submit">Submit</button>
</div>
</div>
<div class="container-login100-form-btn m-t-10 m-b-10">
<button class="login100-form-btn know-risk-text text-dark submit2" v-on:click="know_risk">Know your risk</button>
</div>
</form>
</template>
<script>
export default {
methods: {
member_whitelist_signup() {
// check which button was clicked
if (event.submitter.classList.contains('submit1')) {
// redirect to page1
window.location.href = '/page1';
} else {
// do form submission logic here
}
},
know_risk() {
// redirect to questionnaire page
window.location.href = '/#/questionnaire';
}
}
}
</script>
Note that the event.submitter property is used to determine which button was clicked. Also, the window.location.href property is used to redirect to the desired page.