Luke G
Luke G

Reputation: 1747

Populate web form through URL

I have a third party web form I would like to prepopulate by appending values to the url. Is this possible? If so, how can I pass values to textarea and select for example?

I would simply like to forward the form with pre-populated fields:

link_to_form?name-form-text=sometext&name-form-select=Oprion1

Textarea example:

<FORM NAME="name-form-text">
    <TEXTAREA NAME="name-text-area"WRAP></TEXTAREA>
</FORM>

Select example:

<FORM NAME="name-form-select">
<TABLE>
<TR>
<TD CLASS="name-class">
    <SELECT NAME="name-select">
        <OPTION>Option 1</OPTION>
        <OPTION>Option 2</OPTION>
        <OPTION>Option 3</OPTION>
    </SELECT>
</TD>
</TR>
</TABLE>
</FORM>

Many thanks.

Upvotes: 0

Views: 2622

Answers (2)

jerrymouse
jerrymouse

Reputation: 17792

You can do it in pure javascript.

<script>
function urlParams() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
        vars[key] = value;
    });
    return vars;
}
</script>

Now use the function urlParams(). For eg if url is test.html?textarea=this is textarea value. Use the following line to populate your form's textarea.

document.getElementsByName("name-text-area")[0].value=urlParams()["textarea"];

UPDATE There is however a tiny problem. The text you get in textarea is urlencoded text. In this case you will get: "this%20is%20textarea%20value" So you'll need a urldecode function which is not natively available in javascript. Use the following tweak function instead:

function decode(str) {
     return unescape(str.replace(/\+/g, " "));
}

And replace previous call by:

textareavalue = decode(urlParams()["textarea"]);
document.getElementsByName("name-text-area")[0].value = textareavalue;

Upvotes: 1

Smamatti
Smamatti

Reputation: 3931

You have to access your parameters and fill them into your form. This is possible with in example PHP or JavaScript.

With PHP you can access GET-parameters value with $_GET['my_key']. I don't know about Javascript in detail, but I guess you need to parse the window.location.

nN PHP you can populate you default values with the variable within the code. In Javascript you might need to access the correct element first.

Please provide more information on what languages you can use besides plain HTML to get a better answer.

Upvotes: 0

Related Questions