4

I am trying to disable almost all input elements in a form using jquery, but I need some input elements to be enabled. For example:

$(document).ready(function () { $("#document :input[name!='tloEnable']).attr("disabled", true); });

This works great on the elements I have with the same name 'tloEnable'. However there are a few other elements that have different name attributes (filename, notifyUsers, notifyTeam). How can I include them too while disabling the remaining input elements?

$(document).ready(function () { $("#document :input[name!='tloEnable], [name!='filename'], [name!='notifyUsers'], [name!='notifyTeam']).attr("disabled", true); });
Improve this question
4
  • 8
    Use a common class on the elements and make your life easier. Commented Mar 16, 2015 at 13:39
  • You could add a disabled class to the input elements which should be disabled. Commented Mar 16, 2015 at 13:39
  • use common class for the elements that you want to enable. Commented Mar 16, 2015 at 13:41
  • If, for some reason, you still don't want to use a class, you can do it this way, but it's ugly and probably harder to maintain. Commented Mar 16, 2015 at 13:44

4 Answers 4

Reset to default
14

Use the .not() function and pass a selector; matched elements will be excluded:

$(document).ready(function () { $(":input").not("[name=tloEnable], [name=filename], [name=notifyUsers]") .prop("disabled", true); });

The :not() selector works the same way:

$(document).ready(function () { $(":input:not([name=tloEnable], [name=filename], [name=notifyUsers])") .prop("disabled", true); });
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

4

Give the inputs you wish to disable a class such as disabled-inputs. Then simply:

Jquery 1.6: 

$(".disabled-inputs").prop('disabled', true);

jQuery 1.5 and below: 

$(".disabled-inputs").attr('disabled','disabled');
Improve this answer

Comments

1

Salman A's solution is the one I would probably go with (assuming you can't just give the fields a classname) but you could also consider using jQuery's filter() to only select elements that match your criteria.

Here we're just checking that name does not exist in our list of fieldsNotToBeDisabled but you could easily extend it to test for anything else.

var fieldsNotToBeDisabled = new Array("tloEnable", "filename", "notifyUsers", "notifyTeam"); $("form input").filter(function(index){ return fieldsNotToBeDisabled.indexOf($(this).attr("name"))<0; }).prop("disabled", true);
input {border:1px solid green; } input:disabled { border-color: red; background:#eee;}
<form> <input name="tloEnable" /> <input name="filename" /> <input name="notifyUsers" /> <input name="notifyTeam" /> <input name="testa" /> <input name="testb" /> <input name="testc" /> </form> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Improve this answer

Comments

0 
$('input').not('#company_email_1, #company_email_2, #company_email_3, #company_email_4').attr('disabled', true)
Improve this answer

1 Comment

Your answer could be improved by adding more information on what the code does and how it helps the OP.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.