-
Posts
-
Hi!
I’m using the contact form with the Select Element. In this select element I have 5 options. I would like to have an option already selected when I land on this page. For example:
When I click on link A, I go to a page with the contact form where Option 1 is already selected. When I click on link B, I go to the same page with the contact form where Option 2 is already selected.
Is this possible and if yes, how do I achieve this?
Thanks!
DanielHi Daniel!
You could try doing something like this:
http://stackoverflow.com/a/28702642Best regards,
JosueHi Josue,
Thanks for this! I don’t know Javascript well enough to get this to work, but I will try anyway. Any more tips are more than welcome! :)
Regards,
DanielHi,
I could help you if you link me the contact page with the finalized options that would be selected dynamically.
Regards,
JosueHi Josue,
Wow, what a great service, thanks! I’ve put the links in the private content section.
Cheers, Daniel
Hi,
In the Page with the form, drag a Code Block element below the form and paste this code there:
<script> (function($){ $(window).load(function() { var optionToSelect = window.location.hash.match(/\d+$/)[0]; $("#avia_3_1 > option:nth-child("+optionToSelect+")").attr('selected', true); }); })(jQuery); </script>As for the buttons, you’ll link them like:
http://url_to_contact_page/#option1
http://url_to_contact_page/#option2
http://url_to_contact_page/#option3Regards,
JosueYeah, this works! Awesome! :) One last thing is my options contain comma’s and spaces, e.g. “New Year, 2015-12-31 at 23:59”. I’ve tried %20 but they aren’t accepted.
Not sure what you mean, i could see all options with commas here – http://imgur.com/VzzCNvh
Regards,
JosueWhat I mean is that using for example “New Year, 2015-12-31 at 23:59″ in the URL so it will be pre-selected doesn’t work.
Hi,
The code i posted is meant to work in a numeric basis, so #option1 will select the first option, #option2 the second one and so on (regardless of option value).
Best regards,
JosueHi Josue,
I’m sorry for not explaining right. Let’s say in the select element I have: option1,option2,option3.
http://url_to_contact_page/#option1
http://url_to_contact_page/#option2
http://url_to_contact_page/#option3This works. But I have in the select element: Bodyfit\, 12-12-2015\, 10:30u-12:00u,Bodyfit\, 18-12-2015\, 10:30u-12:00u,Bodyfit\, 01-01-2016\, 14:30u-17:00u,Fitzwanger\, 12-12-2015\, 10:30u-12:00u,Fitzwanger\, 18-12-2015\, 10:30u-12:00u,Fitzwanger 12-01-2016 14:30u-17:00u
The URL http://url_to_contact_page/#Fitzwanger+12-01-2016+14:30u-17:00u should select the last one in the select element, but it doesn’t.
That won’t work, the code is only reading a numeric value passed via hash (#), it doesn’t take the option value into account but the order of it. If you want the last option to be pre-selected link it this way:
http://url_to_contact_page/#option6Because the last element is the sixth. If for some reason you need the URL to contain the actual option value you’d need to mod the JS i provided, although it will get pretty complicated given the length of the options your form has.
Regards,
JosueAaaaah, I think I get it. I can always use #option1/2/3/4/5 in the URL and it corresponds with whatever is the 1st, 2nd, 3rd, 4th, 5th value in the select element?
- You must be logged in to reply to this topic.