Answers.Body: <p>What you're currently seeing is the correct URL for a <code>GET</code> form submission.</p>
  
  <p>You'll need to update the <code>onsubmit</code> handler to construct the URL you wish to visit, based on the selected option.</p>
  
  <p>Here's how to do that, using the omnipresent jQuery. You could probably do the same in plain JS, but I have no idea which browsers you're targeting:</p>
  
  <pre><code>(function ($) {
      $('#sitemap').on('change', function (event) {
          var $select = $(this);
          var $form = $select.closest('form');
          var url = '/desired/path/to/development' + $select.val();
  
          window.location.href = url;
      });
  }(jQuery));
  </code></pre>
  
  <p>Don't forget to remove the current handler from the markup.</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-03-17T08:19:39.510Z
Answers.LastActivityDate: 2017-03-17T08:19:39.510Z
Answers.UserDisplayName: Stephen Lewis
Body: <p>I have a pop up box on a siteplan image that includes a select dropdown to let people select the apartment that they want. However, I can't get the it to go to the url when it's selected. So need some help please.</p>
  
  <p>Currently when you select Plot 18 from the dropdown options it goes to:</p>
  
  <p>websitename/developments/surrey/knowle-hill-park?sitemap=%2Fplot-18</p>
  
  <p>however it needs to go to:</p>
  
  <p>websitename/developments/surrey/knowle-hill-park/available-homes/plot-18</p>
  
  <p>Can someone help show what i'm doing wrong in the form below:</p>
  
  <pre><code>&lt;form action="{{ category.url }}"&gt;
    &lt;div class="form-group"&gt;
      &lt;div class="selectwrap"&gt;
        &lt;select id="sitemap" class="form-control" name="sitemap" onchange="this.form.submit()"&gt;
          &lt;option value=""&gt;Select Plot No&lt;/option&gt;
            {% for entry in craft.entries.section('availablehomes').relatedTo(category).level(2).order('plotPrice desc') %}
            {% if entry.plotType == 'apartment' %}
            &lt;option value="/{{ entry.slug }}"&gt;{{ entry.title }} - {{ entry.floor.label }} - {% if entry.plotAvailability == 'available' %}{{ entry.plotPrice|currency('GBP', true) }}{% else %}{{ entry.plotAvailability.label }}{% endif %}&lt;/option&gt;
            {% endif %}
            {% endfor %}
          &lt;/select&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/form&gt;
  </code></pre>
  
  <p><a href="https://i.sstatic.net/iStVh.jpg" rel="nofollow noreferrer"><img src="https://i.sstatic.net/iStVh.jpg" alt="enter image description here"></a></p>
  
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2017-03-16T16:01:54.180Z
Comments.Text: Does the same thing happen with the other plots or just plot 18? If it happens to all it might be because you have a `'/` infront of your slug. `<option value="/{{ entry.slug }}">` try removing that so it will be: `<option value="{{ entry.slug }}">`
Comments.UserDisplayName: Justin Dekkers
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2017-03-16T17:53:25.997Z
Comments.Text: I had it without the / previously but still didn't work
Comments.UserDisplayName: mention79
Tags: <form><drop-down>
Title: Select dropdown not going to option url
ThreadText: # Select dropdown not going to option url
  
  (Asked by: username_0 on 2017-03-16)
  
  I have a pop up box on a siteplan image that includes a select dropdown to let people select the apartment that they want. However, I can't get the it to go to the url when it's selected. So need some help please.
  
  Currently when you select Plot 18 from the dropdown options it goes to:
  
  websitename/developments/surrey/knowle-hill-park?sitemap=%2Fplot-18
  
  however it needs to go to:
  
  websitename/developments/surrey/knowle-hill-park/available-homes/plot-18
  
  Can someone help show what i'm doing wrong in the form below:
  
  ```
  <form action="{{ category.url }}">
    <div class="form-group">
      <div class="selectwrap">
        <select id="sitemap" class="form-control" name="sitemap" onchange="this.form.submit()">
          <option value="">Select Plot No</option>
            {% for entry in craft.entries.section('availablehomes').relatedTo(category).level(2).order('plotPrice desc') %}
            {% if entry.plotType == 'apartment' %}
            <option value="/{{ entry.slug }}">{{ entry.title }} - {{ entry.floor.label }} - {% if entry.plotAvailability == 'available' %}{{ entry.plotPrice|currency('GBP', true) }}{% else %}{{ entry.plotAvailability.label }}{% endif %}</option>
            {% endif %}
            {% endfor %}
          </select>
        </div>
      </div>
    </form>
  
  ```
  
  [![enter image description here](https://i.sstatic.net/iStVh.jpg)](https://i.sstatic.net/iStVh.jpg)
  
  **Tags:** form, drop-down
  
  > **Comments:**
  > **username_1**: Does the same thing happen with the other plots or just plot 18? If it happens to all it might be because you have a `'/` infront of your slug. `<option value="/{{ entry.slug }}">` try removing that so it will be: `<option value="{{ entry.slug }}">`  
  > **username_0**: I had it without the / previously but still didn't work  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_2 on 2017-03-17. Score: 2 | Accepted answer
  
  What you're currently seeing is the correct URL for a `GET` form submission.
  
  You'll need to update the `onsubmit` handler to construct the URL you wish to visit, based on the selected option.
  
  Here's how to do that, using the omnipresent jQuery. You could probably do the same in plain JS, but I have no idea which browsers you're targeting:
  
  ```
  (function ($) {
      $('#sitemap').on('change', function (event) {
          var $select = $(this);
          var $form = $select.closest('form');
          var url = '/desired/path/to/development' + $select.val();
  
          window.location.href = url;
      });
  }(jQuery));
  
  ```
  
  Don't forget to remove the current handler from the markup.
  
  
  ---
  
  