Linking to a Pre-selected Participation Type

Mike Teague · December 2015

I am trying to link to a specific participation type based off which link a participant has seleceted. I have the following team raiser set up and we have 3 very different participation types. Runner, Virtual Runner, and Cheer I have splash page set up with anchor links to the steps each participation type wiill need to take along with a Join a team button as part of each set of steps. I would like for when the participant clicks join our team that the radio selection on the participation type would correspond to the correct type For example, if someone clicked the link on the splash page to be a Virtual Runner they would first be directed to the TeamRaiser Greeting Page and the anchor tab of the virtual runner steps (which is currenlty working correclty) then if they click join a team under step one the radio button selection for participation type would be Vitual Runner.

Here is the splash page and here is the link for the teamraiser greeting page

Any help would be greatly appreciated.

Daniel Hartanto · December 2015

Hi Mike,

I have something similar to what you are trying to achieve that we implemented for our event.

http://stepout.diabetes.org/site/TR/StepOut/StepOutContent?fr_id=11335&pg=entry

On ours, we have a participant type called "Virtual Walker" that we would like to promote, hence you'll see "Be a Virtual Walker" custom button that when one click on it, it will auto select the "Virtual Walker" participant type from the range of radio button on that Step 1 registration page (pg=ptype).

To achieve that,

You'll want to employ a custom URL parameter to be appended into the default register Teamraiser URL, i.e. http://stepout.diabetes.org/site/TRR?fr_tm_opt=none&pg=tfind&fr_id=11335&vwalk=y

Note: that I add a custom URL parameter called "vwalk" with value of "y" -- you can make up your own naming as well as value if you prefer (esp. you'll need 3 since you have more than just one participant types). The good thing is that this appended custom URL parameter seems to always get carried forward within the flow of the registration step pages (thus no need to store it as session variable or session url parameter)
Next you might want to put Javascript handler to listen to that parameter occurence and to control the selection of which radio button. Something like this (feel free to tweak)

[[?xptypex::x[[S334:pg]]x::   [[?xyx::x[[S334:vwalk]]x::     var radlength = parseInt(jQuery('input[name="fr_part_radio"]').length);     var vwalkradloc = radlength-1;     fr_part_radio_select(vwalkradloc);   ::]] ::]]

Code Explanation:
- Outer S-tag conditional is to check when you are at the 1st Step of the TeamRaiser registration page -- that is where you get to see all the registration participant type (&pg=ptype)
- Inner S-tag conditional to check for your custom URL parameter value, if that parameter exist with the given value then run the JS inside
- This pre-select mechanism depends on the exact ordering of your participant types radio button, so make sure you want them in the same ordering esp. if you have more than just one teamraisers i.e. those child teamraisers of a blueprint. In my case, I put the "Virtual Walker" as the last radio button. For yours, you'll have more to play with the order / location of the radio button.
- If you notice the where about of this function called fr_part_radio_select -- worries not, that is actually the default Convio function that listen to the click action performed on those radio button -- so I am just basically piggy-backing / calling their function to perform the pre-select and associated higlight on specific radio button I want it to get selected programmatically.
Repeat the above steps for the other 2 participant types (you can either reuse the same URL parameter with different value, or create different URL parameter -- up to you)

Hope it helps and happy coding.

regards,

Daniel

Mike Teague · December 2015

Daniel,

Thanks so much for the quick answer. I will test this out today and let you know if I can get it to work.

Mike

Daniel Hartanto:

Hi Mike,

I have something similar to what you are trying to achieve that we implemented for our event.

http://stepout.diabetes.org/site/TR/StepOut/StepOutContent?fr_id=11335&pg=entry

On ours, we have a participant type called "Virtual Walker" that we would like to promote, hence you'll see "Be a Virtual Walker" custom button that when one click on it, it will auto select the "Virtual Walker" participant type from the range of radio button on that Step 1 registration page (pg=ptype).

To achieve that,

You'll want to employ a custom URL parameter to be appended into the default register Teamraiser URL, i.e. http://stepout.diabetes.org/site/TRR?fr_tm_opt=none&pg=tfind&fr_id=11335&vwalk=y

Note: that I add a custom URL parameter called "vwalk" with value of "y" -- you can make up your own naming as well as value if you prefer (esp. you'll need 3 since you have more than just one participant types). The good thing is that this appended custom URL parameter seems to always get carried forward within the flow of the registration step pages (thus no need to store it as session variable or session url parameter)

Next you might want to put Javascript handler to listen to that parameter occurence and to control the selection of which radio button. Something like this (feel free to tweak)

[[?xptypex::x[[S334:pg]]x::   [[?xyx::x[[S334:vwalk]]x::     var radlength = parseInt(jQuery('input[name="fr_part_radio"]').length);     var vwalkradloc = radlength-1;     fr_part_radio_select(vwalkradloc);   ::]] ::]]

Code Explanation:
Outer S-tag conditional is to check when you are at the 1st Step of the TeamRaiser registration page -- that is where you get to see all the registration participant type (&pg=ptype)

Inner S-tag conditional to check for your custom URL parameter value, if that parameter exist with the given value then run the JS inside

This pre-select mechanism depends on the exact ordering of your participant types radio button, so make sure you want them in the same ordering esp. if you have more than just one teamraisers i.e. those child teamraisers of a blueprint. In my case, I put the "Virtual Walker" as the last radio button. For yours, you'll have more to play with the order / location of the radio button.

If you notice the where about of this function called fr_part_radio_select -- worries not, that is actually the default Convio function that listen to the click action performed on those radio button -- so I am just basically piggy-backing / calling their function to perform the pre-select and associated higlight on specific radio button I want it to get selected programmatically.

Repeat the above steps for the other 2 participant types (you can either reuse the same URL parameter with different value, or create different URL parameter -- up to you)

Hope it helps and happy coding.

regards,

Daniel

Linking to a Pre-selected Participation Type

Comments

Categories