title: onchange dropdown add parameters to url in inputbox
body: <p>I am designing affiliate program, in which each user has his own link-code aka tracking URL.
  I am willing to add extra parameters to it depending on the drop down selection which will be different landing pages.</p>
  <p>e.g.
  original URL:</p>
  <pre><code>http://www.google.com/tracker/blah1
  </code></pre>
  <p>and if user selects value from down the URL should be like:</p>
  <pre><code>http://www.google.com/tracker/blah1/queryid/1
  </code></pre>
  <p>I am using this code for displaying the URL to the end user in the input box set as readonly.</p>
  <pre><code>&lt;input size=&quot;100&quot; type=&quot;text&quot; value=&quot;&lt;?=$url;?&gt;&quot; readonly&gt; &amp;nbsp;- &amp;nbsp;&lt;a  target=&quot;_blank&quot; href=&quot;&lt;?=$url;?&gt;&quot;&gt;Link&lt;/a&gt;&lt;/b&gt;
  </code></pre>
  <p>There's gonna be two drop down like these.</p>
  <pre><code>&lt;select name=&quot;niche&quot;&gt;
  &lt;option value=&quot;0&quot; label=&quot;choose one&quot;&gt;choose one&lt;/option&gt;
  &lt;option value=&quot;/queryid/1&quot; label=&quot;option 1&quot;&gt;option 1&lt;/option&gt;
  &lt;option value=&quot;/queryid/2&quot; label=&quot;option 2&quot;&gt;option 2&lt;/option&gt;
  &lt;option value=&quot;/queryid/3&quot; label=&quot;option 3&quot;&gt;option 3&lt;/option&gt;
  &lt;option value=&quot;/queryid/4&quot; label=&quot;option 4&quot;&gt;option 4&lt;/option&gt;
  &lt;option value=&quot;/queryid/5&quot; label=&quot;option 5&quot;&gt;option 5&lt;/option&gt;
  &lt;option value=&quot;/queryid/6&quot; label=&quot;option 6&quot;&gt;option 6&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  <p>By selecting <kbd>option 1</kbd> it should add <strong>/queryid/1</strong> to the end of the url.
  if none is selected then no change will be there.</p>
  <pre><code>&lt;select name=&quot;landingpage&quot;&gt;
  &lt;option value=&quot;0&quot; label=&quot;choose one&quot;&gt;choose one&lt;/option&gt;
  &lt;option value=&quot;/cid/1&quot; label=&quot;landing 1&quot;&gt;landing 1&lt;/option&gt;
  &lt;option value=&quot;/cid/2&quot; label=&quot;landing 2&quot;&gt;landing 2&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  <p>By selecting <kbd>landing 1</kbd> will add <strong>/cid/1</strong> to the end of the URL.
  if none is selected then no change will be there.</p>
  <p>So how do I do this?</p>
  <p>Update: updated the values of dropdown as currently using htaccess rewrite rules.</p>
  <p><strong>update:</strong><br />
  I am using as specified by &quot;Rishi Php&quot; demo is here <a href="http://jsfiddle.net/g6U4a/2/" rel="nofollow noreferrer">http://jsfiddle.net/g6U4a/2/</a></p>
  <p>but by default its not showing <strong>SourceUrl</strong>
  it should show the source URL by default, in the box but it shows it when user changes drop down values.
  How can I achieve this?</p>
  <p><strong>update:</strong><br />
  &quot;Rishi Php&quot; fixed the issue of on load default url.
  here is the code. <a href="http://jsfiddle.net/g6U4a/3/" rel="nofollow noreferrer">http://jsfiddle.net/g6U4a/3/</a>
  Thanks to all of you guys.</p>
  <p>Don't forget to add this in header:</p>
  <pre><code>&lt;script src=&quot;http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js&quot;&gt;&lt;/script&gt;
  </code></pre>
  <p>replaced</p>
  <pre><code>var SourceUrl = &quot;http://www.google.com/?tracker=blah1&quot;;
  </code></pre>
  <p>with</p>
  <pre><code>var SourceUrl = &quot;&lt;?=$url;?&gt;&quot;;
  </code></pre>
  <p>so each affiliate will have unique link</p>