Select2 open dropdown upward -dropup
<p>I want to show the dropdown list upward each time regardless the enough space below.</p>

<p>How to achieve it? What is the key point to do this?</p>

<p><strong>UPDATE</strong></p>

<p>Here is how I initialize Select2:</p>

<pre><code>$("select[name=ingredients]").select2();
</code></pre>

<p>HTML side:</p>

<pre><code>&lt;select name="ingredients" multiple class="populate select2-offscreen form-control" tabindex="-1" style="width: 100%;"&gt;
    &lt;optgroup label="Diğer"&gt;
        &lt;option value="0"&gt;Un&lt;/option&gt;
        &lt;option value="1"&gt;Şeker&lt;/option&gt;
        &lt;option value="2"&gt;Tuz&lt;/option&gt;
    &lt;/optgroup&gt;
&lt;/select&gt;
</code></pre>

<p><a href="https://i.stack.imgur.com/1pbSY.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1pbSY.png" alt="selelect2 upward"></a></p>