Disable all form elements except those in the form currently being used

Question

Say I have a page with multiple forms on it. When one form has information input into it, all the elements of the other forms should be disabled.

I have tried selecting all the forms except the current one using .not(), then getting each input element using the :input selector and applying the disabled property to it, but when information is input, all the elements in all the forms get disabled regardless of which form was used.

$('form').on("input", ":input", function() { $('form').not(this).each(function() { $(this).find(':input').prop('disabled', true); }); });

Fiddle Link (Very messy, but just to demonstrate) When information is entered into any of the elements in the top form, all the elements in the bottom form should be disabled.

Taplar · Accepted Answer · 2017-05-29 15:48:58Z

1

this in the case of that delegate is the input field that got the input event. you will need to get it's closest('form') before you perform your not() logic.

$('form').not($(this).closest('form'))

answered May 29, 2017 at 15:48

Taplar

25k4 gold badges24 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

cnfw Over a year ago

This works perfectly, thanks!! I had assumed .not(this) would be seen as "not this form" because of 'form' just before. I was able to simply this further to avoid using .each(): $('form').not($(this).closest('form')).find(':input').prop('disabled', true); Thanks again for your help!

Taplar Over a year ago

Yeah, no need for the each, :)

Collectives™ on Stack Overflow

Disable all form elements except those in the form currently being used

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related