Applying onChange event on a div for all input fields

Question

Hello actually I have an div tag in which there are multiple form. What I want is to apply onChange event on the div for each input field. Present I am trying this

Applying form class to each form and getting onchange event

$('.form :input').change(function(e){
   console.log("Element changed");
});

But I am not able to get the info which field is changed and what is the updated value.

So can I apply it on the div itself? If not how can the get the field info which is changed.

Answer 1

Try this:

$(function(){
   $('.form :input').change(function(e){
      console.log($(e.target).attr('id'));
   });
});

here e.target is your current element which got the event of change.

---

As per your comment:

How we can say which field is changed.

you need to assign an unique identifier to all your input type text:

<input type='text' id='a'>
<input type='text' id='b'>
   ..................

then use this:

$('.form :input').change(function(e){
   $('#log').prepend('<p>Form changed ' + $(e.target).attr('id') + '</p>')
});

A demo of your fiddle here.