Question

I have a particular form on my page with multiple input values and a button. Example:

<form id="myForm" method="get">
<input type="text" id="blah1" value="blah" />
<input type="hidden" id="blah2" value="blah2" />
</form>
<button type="button" id="awesomeButton">Click for Link</button>
<div id="link">http://mysite.com/?blah1=blah&blah2=blah2</div>

I want to find an easy way to make it so when someone clicks the button on my website, it looks at all the form values and generates a link which is exactly the same as if the form was set to use method=”get” and submitted. So if they click “awesomeButton”, then it’ll generate a link and show it to the person, such as http://mysite.com/?blah1=blah&blah2=blah2

Does anybody know an easy way to grab the values from the form and make a link?

Something like…

$('button#awesomeButton').click(function()
{
//Grab all form elements, maybe something like var blah = $('#myForm :input'); ??
var link = ???;//Generate a link somehow
$('div#link').html(link);
});

Thanks

Answer 1

The easy way is to use a library like jQuery or dojo that will do the job for you. In jQuery for example:

$("#myForm").serialize();

The documentation is here.

In dojo:

dijit.byId('myForm').get('value');

Follow this link for the documentation.