Refreshing Form To Fetch URL Parameters


#1

Hi,

I’ve setup a page where the user can either select from a dropdown within a form for a particular size, or scroll down and click ‘enquire’ for a specific size by clicking a button.

I would like this action to scroll the user to the top of the page and auto-fill the size field with what they selected. Currently i’ve managed to get the URL parameters to generate when the user clicks on the button, but for some reason the form won’t autofill with the URL parameters.

I’m assuming the form itself needs to be refreshed to reflect this?

Any ideas?

Thanks in advance!


#2

Bump - Any ideas? Thanks!


#3

Hi @Eliot_Shiner,

Can you please share the JS/jQuery script you are using and we can help you find the problem?

Best,
Hristian


#4

So i’m using the following script and it’s appending to the URL but i’m wanting the form to also then pre-fill a field based on this parameter (which it seems it can’t do without loading the page with the parameter already in place).

<script>
var params = window.location.search;
var character = "&";
if (params == ""){
character = "?";	
}

$("#lp-pom-button-202").click(function() { // Add Id of button
var url = $(this).attr('href').split("?")[0];
$(this).attr("href", url + params + character + "size=45ft"); // add parameters to pass through to lightbox
});
</script>

Thanks!


#5

Any ideas? Thanks


#6

Hi @Eliot_Shiner,

Generally speaking pre-filling dropdowns is a bit tricky and even more so when the form is in a lightbox.

Lightboxes load content inside an iframe.

It’s not impossible but you would have to be comfortable writing and adjusting your own scripts.

Another member of the community, @Phillip, posted a break-down on how you would do it and the necessary script.
(Keeping in mind his form was on the main page).

Here is his explanation from a few years back.

It should give you a good starting point.

Best,
Hristian