0

A weird simple question.I have an empty form. After rendering of form, I am dynamically adding elements to it. I just want to listen to the form, whenever the element is appending to it. I have been facing trouble on doing this. So I had a thought, any native event while appending or removing an element from form will be pretty much good for my case. As far I explored, I didn't find no more events on appending elements into the form. Any help will be highly appreciated.

Jeyanth
  • 531
  • 2
  • 6
  • 19
  • 1
    Take a look at [**`MutationObserver`**](https://developer.mozilla.org/en/docs/Web/API/MutationObserver). Besides, since you are adding the elements yourself I don't think you are in need for an event, just call the code you want to call after you append an element – ibrahim mahrir Nov 06 '19 at 11:17
  • @ibrahimmahrir, Your solution works. MutationObserver listens to full DOM, I just want to listen the form element alone, since I have multiple elements in the DOM other than form. It may lead to performance related issues. – Jeyanth Nov 06 '19 at 11:25
  • You can target a specific element instead of the whole document. Check out [this example](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver#Example) from MDN – ibrahim mahrir Nov 06 '19 at 11:28
  • BTW, did you think about my other approach: don't use events at all, instead call the code that you want to call immediately after you insert/append the elements. – ibrahim mahrir Nov 06 '19 at 11:29

1 Answers1

1

I don't know an event for that but maybe you can try by adding a conditional to the function that adds the element.

I mean, when you add the element, check if the element has been well added and fire another function with the notification. Each time you add an element, the return value is the element you added.

ibrahim mahrir
  • 31,174
  • 5
  • 48
  • 73