Multiple select box and send values as url parameteres
<p>I have this html:</p>

<pre><code>&lt;select name="garden" multiple="multiple" id="garden"&gt;
  &lt;option value="1"&gt;Flowers&lt;/option&gt;
  &lt;option value="2"&gt;Shrubs&lt;/option&gt;
  &lt;option value="6"&gt;Trees&lt;/option&gt;
  &lt;option value="3"&gt;Bushes&lt;/option&gt;
  &lt;option value="4"&gt;Grass&lt;/option&gt;
  &lt;option value="5"&gt;Dirt&lt;/option&gt;
&lt;/select&gt;
&lt;select name="po" multiple="multiple" id="po"&gt;
  &lt;option value="1"&gt;po1&lt;/option&gt;
  &lt;option value="2"&gt;po2&lt;/option&gt;
  &lt;option value="6"&gt;po3&lt;/option&gt;
  &lt;option value="3"&gt;po4&lt;/option&gt;
  &lt;option value="4"&gt;po5&lt;/option&gt;
  &lt;option value="5"&gt;po6&lt;/option&gt;
&lt;/select&gt;
&lt;div&gt;&lt;/div&gt;
</code></pre>

<p>I want to send values of selected options as url parameteres. With this javascript:</p>

<pre><code>$("select").change(function () { 
    var id = $(this).attr('name');
    var str = "";
    $("select option:selected").each(function () {

       str += "&amp;"+id+"="+ $(this).attr('value');             
       });
      $("div").text(str);
    })
    .trigger('change'); 
</code></pre>

<p>When the other select box changes, str is replaced with another:
<a href="http://jsfiddle.net/eZKUU/" rel="nofollow">http://jsfiddle.net/eZKUU/</a></p>

<p>How can I send values to url without replacing?</p>

<p>Thanks in advance</p>
