CODEWITHSUNDEEP
jqueryhtmldynamic-html
El_L
El_L

Reputation: 355

dynamic html from jQuery

I have a JS function that records HTML into the DIV: $("#DivHtml").html('what i want...')

the HTML also has <select> with option list

the selection has EVENT- onchange

This event call to Jquery function where change the HTML and adds attribute (html in DivHtml)

but after function is occur,

I display the innerHTML of DivHtml and I see that HTML remains the same as I did it at first,

He has not changed from the function in event onchange (I'm sure he went to a function - I did ALERT)

why?

Upvotes: 0

Views: 127

Answers (2)

Sergio
Sergio

Reputation: 28837

You need either to append the new html or use .on (removing the inline onchange) like:

$(document).on('change', '#selectID', function(){...});

PS: I think you mean <select> and not <selection>

Upvotes: 1

Rory McCrossan
Rory McCrossan

Reputation: 337560

I think you're saying that the event you attached the select is lost when you update the content of the div via html()? If that is the case, the reason is because the element which the event was bound to has been removed from the DOM and a new one has been added in it's place.

The easiest solution is to use a delegated event handler, bound to the container like this:

// your HTML updating logic
$("#DivHtml").html('what i want...')

// select change handler
$('#DivHtml').on('change', 'select', function() {
   alert('select value was changed');
});

Upvotes: 0

Related Questions