HTML鏈接，追加查詢字符串到當前URL

Question

我有一個簡單的形式是這樣的：

<form> 
     <input name="search"> 
     <button type="submit">Search...</button> 
     Price: <a href="?filter=price&direction=asc">Low</a> | 
      <a href="?filter=price&direction=desc">High</a> 
</form> 

注意input與search名稱可以搜索一個關鍵字，而<a>鏈接作爲過濾器工作。當您提交表單時，網址將會是localhost/products?search=smartphone。通過我的服務器端腳本，這將生成一個頁面，其中包含名稱中包含單詞smartphone的所有產品。

現在說我在localhost?search=smartphone。如果我點擊Low，它會產生

http://localhost/products?filter=price&direction=asc 
    -> filter all products with price asc 

不過，我真的很打算得到的是

http://localhost/products?search=smartphone&filter=price&direction=asc 
    -> search for 'smartphone', and filter only those results by price asc 

我要如何才能到達search和filter結合（其asc或desc方向） ？在旁註中，這在搜索/過濾方面是否有效？我應該將<a>更改爲<input>？我幾乎沒有搜索機制的經驗，所以任何建議，將不勝感激！

Answer 1

使用

onclick="form.submit();" 


<form id="my_form"> 
    <input name="search"> 

    Price: <a href="?search="+ escape(document.forms.my_form.search.value)+"&filter=price&direction=asc" onclick="document.getElementById('my_form').submit(); return false;">Low</a> | 
     <a href="?search="+ escape(document.forms.my_form.search.value)+"&filter=price&direction=desc" onclick="document.getElementById('my_form').submit(); return false;">High</a>