jQuery - Disable Form Fields

Question

Hey all,

I have 2 fields: 1 input, 1 select box.

Is it possible to make the browser disable one of the fields when the user uses the other?

For example, if the user is entering data into the input, the select box is disabled. If the user is selecting data from the select (dropdown), the input is disabled.

Any help with this would be much appreciated.

Cheers in advance.

Answer 1

<script type="text/javascript" src="jquery.js"></script>          
<script type="text/javascript">
  $(document).ready(function() {
      $("#suburb").blur(function() {
          if ($(this).val() != '')
              $("#post_code").attr("disabled", "disabled");
          else
              $("#post_code").attr("disabled", "");
      });

      $("#post_code").blur(function() {
          if ($(this).val() != '')
              $("#suburb").attr("disabled", "disabled");
          else
              $("#suburb").attr("disabled", "");
      });
  });
</script>

You'll also need to add a value attribute to the first option under your select element:

<option value=""></option>

Answer 2

try this

$("#inp").focus(function(){$("#sel").attr('disabled','true');});

$("#inp").blur(function(){$("#sel").removeAttr('disabled');});

vice versa for the select also.

Answer 3

$('input, select').attr('disabled', 'disabled');

Answer 4

Hey it worked like charm. Thanks for the code. Time saving.