jquery disable specific submit button

Question

I have a couple of divs with the same class on one page that have a form with input fields and a submit button in them. I check with jquery for each input field if it is empty, and I want the submit button in that specific div to be disabled when theres an empty field in that div. Got this so far:

jQuery(document).ready(function(){
    $('.shipdiv input').each(function(){
    if( $(this).val() == ''){
    $(this).css("background-color","#ff0000");
    $(this).parent('.contact-button').attr('disabled', 'disabled');
}
});
   });

When theres a field empty it colors red, and then I try to disable the submitbutton that is in its parent. But thats not working. Anyone got an idea on how to do this?

HTML looks somthing like this:

<div class="shipdiv">
<form name="order_002" method="post" action="">
<input type="textfield" class="ship_data" name="bedrijfsnaam"/>
<input type="textfield" class="ship_data" name="straat" />
<input type="textfield" class="ship_data" name="postcode"/>
<input type="submit" name="ship-submit" id="ship-submit" class="contact-button" value="Aanmelden">
</form>
</div>

And then with several of these divs.

Could you post some of your HTML?

user1864610
– user1864610

2013-07-04 09:56:48 +00:00
Commented Jul 4, 2013 at 9:56 — user1864610
– user1864610, Commented Jul 4, 2013 at 9:56
thats generated with php but ill try to recreate it.

Snuur
– Snuur

2013-07-04 09:58:07 +00:00
Commented Jul 4, 2013 at 9:58 — Snuur
– Snuur, Commented Jul 4, 2013 at 9:58

4b0 · Accepted Answer · 2013-07-04 09:59:20Z

2

try:

 $(this).parent('div').find('.contact-button').attr('disabled', 'disabled');

or use closest:

 $(this).closest('div').find('.contact-button').attr('disabled', 'disabled');

answered Jul 4, 2013 at 9:59

4b0

22.4k30 gold badges97 silver badges143 bronze badges

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

Comments

MrCode · Accepted Answer · 2013-07-04 09:57:32Z

2

It can be done by finding the parent div, relative to the current input, then finding the button within the div.

$(this).parents('.shipdiv').find('.contact-button').prop('disabled', true);

Side note: .prop('disabled', true) is preferred to .attr().

answered Jul 4, 2013 at 9:57

MrCode

64.6k10 gold badges95 silver badges114 bronze badges

Collectives™ on Stack Overflow

jquery disable specific submit button

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related