Set up dynamic form submission redirect based on radio button selection

Ask the community
,
1

Hi there - I would like to set up a form and have the submit button redirect to different URLs based on the option selected on a single radio button field.

I believe this is close to what I am seeking, but this based on a dropdown field, not a radio button selection.
https://community.wix.com/velo/forum/coding-with-velo/unique-page-redirect-depending-on-info-on-form-submission-1

I’m new to Velo and not a developer. I have figured out where to add the code, but would love as much detail as possible on all the steps needed to get this to work. I tried the dropdown option linked above, but when I tested the form, it took me to a blank page leading me to believe I was missing a step.

Also, since this is a workaround, how do I set up the submit button settings in the form settings?

Thanks!

2

Hi @katie4449 !

  1. Create a new page in Wix and add a form element to the page.

  2. Add a single radio button field to the form element. To do this, click on the form element and then click on the “Add Field” button. Select “Radio Button” from the list of available fields.

  3. Edit the radio button field and add the options that you want to display. To do this, click on the field and then click on the “Edit Field” button. In the “Options” section, enter the options that you want to display, one per line.

  4. Assign a unique value to each option. To do this, click on each option and then enter a unique value in the “Value” field.

  5. Add a submit button to the form element. To do this, click on the form element and then click on the “Add Button” button. Select “Submit Button” from the list of available buttons.

  6. Edit the submit button and set the action to “Custom”. To do this, click on the button and then click on the “Edit Button” button. In the “Button Link” section, select “Custom” from the list of available actions.

Try out this:

if ($w('#radioButtonGroup1').value === 'option1') {
    wixLocation.to ('http://www.example.com');
} else if ($w('#radioButtonGroup1').value === 'option2') {
    wixLocation.to ('http://www.example2.com');
} else if ($w('#radioButtonGroup1').value === 'option3') {
    wixLocation.to ('http://www.example3.com');
}
3

@michaelstrauss307 wow, thank you so much for the detailed reply! It worked! I had to add a couple more things since I was using a full form vs just form elements, but I figured it out. For those wondering, here is the final code that worked when clicking a form button:


import wixLocation from 'wix-location';

export function submitForm_click(event) {

if ($w('#radioGroup6').value === 'value1') {
    wixLocation.to ('http://www.example1 .com');
} else if ($w('#radioGroup6').value === 'value2') {
    wixLocation.to ('http://www.example2 .com');
} else if ($w('#radioGroup6').value === 'value3') {
    wixLocation.to ('http://www.example3 .com');
}

}
4

image
image1470×1122 77.5 KB

Not sure what I’m doing wrong - but can’t see the ‘custom’ action option for submit button…

When I past in the code, nothing happens… Has this feature been removed?

Thanks!!