Re-order form fields on submit url
- by user2521764
I have a get form with several visible and hidden input fields. When the form is submitted, selected fileds with their values are appended to the url in the order they are placed in the form. Is there a way to re-order the parameters in the url using jQuery? Note that for the reasons of usability, I can not re-order the elements on the form itself.
I know it beggs the question "why would I want to do it?", but the reason is that I will be hitting a static page, so the order of the parameters have to be exactly how they are in the static page url. For example, my form returns a url:
http://someurl??names=comm&search=all&type=list
while the static page has a url:
http://someurl??search=all&type=list&names=comm
A simplified form example is here:
<form id="search_form" method="get" action="http://www.cbif.gc.ca/pls/pp/ppack.jump" >
<h2>Choose which names you want to be displayed</h2>
<select name="names">
<option value="comm">Common names</option>
<option value="sci">Scientific names</option>
</select>
<h2>Choose how you want to view the results</h2>
<input type="radio" name="search" value="all" id="complete" checked = "checked" />
<label for="complete" id="completeLabel">Complete list</label>
<br/>
<input type="radio" name="p_null" value="house" id="house" />
<label for="house" id="houseLabel">House plants only</label>
<br/>
<input type="radio" name="p_null" value="illust" id="illustrat" />
<label for="illustrat" id="illustratLabel">Plants with Illustrations</label>
<br/>
<input type="hidden" name="type" value="list" />
<input type="submit" value="Submit" />
</form>
I can get form fields with values using $(#search_form).serializeArray() and massage the array like I want to, but I don't know how to set it back, i.e. modify the serialized values so that the submitted url has my order of parameters. I'm not even sure if this is the right way to go about it, so any pointers would be greatly appreciated.