How do I change the value of an element when another element is changed

cj1005

Hi,

I have a custom template on my editor and after I change the value of a field, I want to programmatically change another field.

I tried doing it via JQuery, but the change event does not fire, see my code below, in this example I'm just trying to replace the value of a target element with the value of the source element (both of these elements are input boxes):

$('#source').change( function () {
  console.log("source changed");
  var newVal = $('#source').val();
  $('#target').val(newVal);
});

Maybe I'm going about this the wrong way, so any advice would be appreciated?

TVM, Chris

cj1005

Hi All,

Don't worry I have answered my own question.

If it is of any use to anyone, the answer was because the element is created dynamically it does not exist at page init, so I had to attach the event to the main document with the source as the target of the change, see below:

$(document).on('change', '#source', function(){
  console.log("source changed");
  var newVal = $('#source').val();
  $('#target').val(newVal);
});

Chris

allan

Thanks for posting back - good to hear you have it working now.

Allan