0

This should be simple but my mind has gone blank. Given I want to update the input#mirror-field when the input just above it in the markup changes - how can I target that "next" ID?

Given (don't ask!) there are other inputs with the same ID on the page.

So in simple terms, I want to traverse to only the next input with that ID, and no others.

<div class="controls">
 <input type="text" class="form_datetime" value="11/09/16">
 <input type="hidden" id="mirror_field" name="nextcontact" value="07/04/17">
 <input type="hidden" name="currentnextcontact" value="2016-09-11">
</div>

Current jQuery:

 $(".form_datetime").change(function() {
    var $value = $(this).val();
    $('#mirror_field').val($value); //Which I assume will affect all the #mirror_field inputs on the page (I know, I know)
 });
mayersdesign
  • 5,062
  • 4
  • 35
  • 47

1 Answers1

2

You can use jQuery's .siblings() function:

$(".form_datetime").change(function() {
    var $value = $(this).val();
    $(this).siblings('#mirror_field').val($value);
    // This will select the "mirror_field" element that are siblings
    // of the "form_datetime" element that just changed.
});
Arnelle Balane
  • 5,437
  • 1
  • 26
  • 32