Pass drop-down list values from view to controller
<p>I have a select tag with several options and each of the options are designated a value. </p>

<pre><code>&lt;select id="dropdown"&gt;
    &lt;option value="1"&gt;Option 1&lt;/option&gt;
    &lt;option value="2"&gt;Option 2&lt;/option&gt;
    &lt;option value="3"&gt;Option 3&lt;/option&gt;
    &lt;option value="4"&gt;Option 4&lt;/option&gt;
&lt;/select&gt; 
</code></pre>

<p>Additionally, I have the following JQuery script. </p>

<pre><code>$(function() {
    $(#dropdown).change(function() {
        var option = $(this).find("option:selected").text();
        var optionValue = $(this).val(); 
</code></pre>

<p>I've checked both values using an 'alert' and they're correct. Now I want to pass these values from the view to the controller. I put the select tag within a form and tried using '.submit()' on both values, but that causes the script to crash. I'm not sure if I'm using '.submit()' correctly, as I'm a beginner in JavaScript and Jquery. So in short, how can I get the option tag value into a method of my controller? </p>

<p><strong>EDIT 1</strong></p>

<p>The select tags are in a form, and I've been trying to submit like this: </p>

<pre><code>$(this).val().submit()
</code></pre>

<p><strong>EDIT 2</strong></p>

<p>Additionally, here is the controller method I'm trying to get the value into. </p>

<pre><code>[HttpPost]
public ActionResult Index(string dropdown)
{
    string value = dropdown; 

    //--- conditional logic ---

    return View()
}
</code></pre>