u54r
u54r

Reputation: 1805

Find all next input fields

My form will automatically calculate the remaining balance when the user enters payment in the input field. For example, assume the total is $1000 and the user wants to divide this into 3 payments. He will put $500 in the first payment field then remaining $500 will be distributed equally among the next payment fields. $250 each. If the user wants $200 for the second payment then $300 will be inserted in the last payment field. I can't get the jquery find next input fields.

This is my form

<div id="payment-terms-fields">
  <div class="payment-rows">
    <div>
       <input type="text" name="payment[]" class="payment-terms">
       <span class="payment_term_sign">%</span>
    </div>
    <div><select class="term">....</select></div>
  </div> 

  <div class="payment-rows">
    <div>
       <input type="text" name="payment[]" class="payment-terms">
       <span class="payment_term_sign">%</span>
    </div>
    <div><select class="term">....</select></div>
  </div> 



</div>

This is my jquery to find the next input fields

$(document).on("keyup", ".payment-terms", function() {
 var nextFields = $(this).parents("#payment-terms-fields").find('input.payment-terms').not(this);
});

Above code finds all input fields except the this How do I find next input fields?

Upvotes: 2

Views: 310

Answers (3)

rtpHarry
rtpHarry

Reputation: 13125

Ok I solved it!

Not sure how efficient it is or if it can be improved but this worked for me in this fiddle:

$(this).parent().parent().nextAll().find(".payment-terms").css("background", "#00ff00");

Full demo in this fiddle:

Upvotes: 0

Tomanow
Tomanow

Reputation: 7377

Have you tried something like $(this).next().find('input.payment-terms') ?

Upvotes: 0

Ringo
Ringo

Reputation: 5493

You can descend directly from the ID, because IDs are unique on a page. No need to use parents().

$('#payment-terms-fields').find('input.payment-terms').not(this).next()

Upvotes: 2

Related Questions