在提交网址上重新订购表单字段

时间:2013-06-25 21:55:52

标签: javascript jquery forms

我有一个带有几个可见和隐藏输入字段的get表单。提交表单时,选定的文件及其值将按照它们放置在表单中的顺序附加到URL。有没有办法使用jQuery重新排序url中的参数?请注意,出于可用性的原因,我无法对表单本身的元素进行重新排序。

我知道它提出了“我为什么要这样做?”的问题,但原因是我会点击静态页面,所以参数的顺序必须与它们在静态页面中的完全一致网址。例如,我的表单返回一个url:

http://someurl?names=comm&search=all&type=list

虽然静态页面有一个网址:

http://someurl?search=all&type=list&names=comm

这里有一个简化的表单示例:

<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> 

我可以使用$(#search_form).serializeArray()获取带有值的表单字段并按照我想要的方式按下数组,但我不知道如何设置它,即修改序列化值以便提交url有我的参数顺序。我甚至不确定这是否是正确的方法,所以任何指针都将非常感激。

1 个答案:

答案 0 :(得分:1)

一种快捷的方法可能是在按下提交按钮后重新排序实际的表单元素,同时隐藏表单以便用户看不到它。

另一种方法是让所有可见的表单元素都没有名称,然后按照您喜欢的顺序将所有数据传输到隐藏的输入字段。

但在这种情况下,由于数据非常简单(无法进行转义),您还可以在每次更改某个表单元素时将所需的URL组合为字符串,并将其作为提交按钮的href,以便你并没有真正提交,而只是关注一个链接。