How to attach a delegate when adding a new record

Question

I have a form where i attach the OnChange method like

$(document).ready(function () {
    $('#fieldId').change(function () {
    ...
   }
}

But i have the case when i add a new record with the Id "fieldId" from a function as

function addTeamMember() {
var newItem= "<input  id='fieldId' type='text'>"
$("#other").append(newItem);
...
}

But the Change is not fired when i change the newly added field. Can somebody help me with an idea?

Thanks.

For a start, don't use the same `id` for multiple elements (even when created dynamically) — haim770, Apr 21 '16 at 12:19

score 2 · Answer 1 · answered Apr 21 '16 at 12:19

2

Change the onchange event listener to:

$('body').on('change', '#fieldId', function () {
  // ...
}

you can replace the 'body' with any container that is wrapping the dynamically added DOM element. This way, you delegating the event to existing or not existing yet elements.

answered Apr 21 '16 at 12:19

Jumpa

878
1
8
12

The better approach would be to bind as closest as possible to the elements (usually to their container element) and not to `body`. – haim770 Apr 21 '16 at 12:21
Wonderful! Thanks! – Jake Manet Apr 21 '16 at 12:24
since I dont know his DOM structure, I stated 'body' and also stated below that all he needs is some container around the DOM element – Jumpa Apr 21 '16 at 12:26

How to attach a delegate when adding a new record

1 Answers1