title: Enable or disable form elements in jquery
body: <p>How do I properly disable and enable form elements using jquery. I need to disable the text form element when I click on the select. And vise versa.    </p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
      &lt;script src="jq.js"&gt;&lt;/script&gt;
      &lt;script&gt;
  
      $(function(){
  
      $('#fromdate').click(function(){
          $('#yosh').attr('disabled','disabled');
          $('#fromdate').removeAttr('disabled');
      });
  
      $('#yosh').click(function(){
          $('#yosh').removeAttr('disabled');
          $('#fromdate').attr('disabled','disabled');
      });
  
      });
      &lt;/script&gt;
  
      &lt;/head&gt;
      &lt;body&gt;
      Sort by:
      &lt;select name="yosh" id="yosh"&gt;
      &lt;option value="daily"&gt;daily&lt;/option&gt;
      &lt;option value="weekly"&gt;yesterday&lt;/option&gt;
      &lt;option value="weekly"&gt;weekly&lt;/option&gt;
      &lt;option value="monthly"&gt;monthly&lt;/option&gt;
      &lt;option value="yearly"&gt;yearly&lt;/option&gt;
  
      &lt;/select&gt;&lt;br/&gt;
      date range:&lt;br/&gt;
  
      From:&lt;input type="text" value="" name="fromdate" id="fromdate"&gt;&lt;/input&gt;&lt;br/&gt;
      To:&lt;input type="text" value="" name="todate" id="todate"&gt;&lt;/input&gt;&lt;br/&gt;
  
  
      Customer:&lt;input type="text" value="" name="customer" id="customer"&gt;&lt;/input&gt;
  
      &lt;/body&gt;
  
      &lt;/html&gt;
  </code></pre>