jQuery Validate and disabled input field
<p>I'm using below bootstrap as a dropdown picker, which then with an associated jQuery function displays the choosen field in the <code>input</code> <code>type="text"</code>. But users can still write their own in the input field, which I would like to avoid. I tried using the <code>disabled</code> attribute on the input field, but if I do that the jQuery Validate plugin will just ignore it and grant permission even if it's empty.</p>

<p>Is it possible to "deactivate" an input field with <code>type="text"</code>, without using the <code>disabled</code> attribute so that I may still use jQuery Validate.</p>

<pre><code>&lt;div class="form-group"&gt;
    &lt;div class="input-group"&gt;
         &lt;div class="input-group-btn"&gt;
              &lt;button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"&gt;Choose&lt;span class="caret"&gt;&lt;/span&gt;&lt;/button&gt;
              &lt;ul class="dropdown-menu"&gt;
                  &lt;li&gt;&lt;a href="#" id="a"&gt;1&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#" id="b"&gt;2&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#" id="c"&gt;3&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#" id="d"&gt;4&lt;/a&gt;&lt;/li&gt;
                  &lt;li role="separator" class="divider"&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#" id="e"&gt;5&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
         &lt;/div&gt;
         &lt;input type="text" id="abc" autocomplete="off" name="abc" placeholder="Select *" class="form-control" aria-label="..."&gt;
    &lt;/div&gt;  
&lt;/div&gt;
</code></pre>