appendTo objects wont take action on jquery change

Question

I have function on input change, it works for the first input that is already there, but when jscript adds aother
Input object with appendTo, the same function does'nt work...

$("input[type=file]").change(function() {
$('<input name="fails[]" type="file" />').appendTo('#input_lauki');
$('<a href="#" onclick="dzest(this);return false" class="link" name="dzest" style="font-weight:normal; display:inline;">Izdzēst</a><br/>').appendTo('#input_lauki')
$('.link').css('display','inline');

});

Thank you!

score 0 · Accepted Answer · answered Apr 26 '12 at 08:18

You need to use $.on to bind new elements added to the DOM as well:

$.on("change", "input[type=file]", function() {
    $('<input name="fails[]" type="file" />').appendTo('#input_lauki');
    $('<a href="#" onclick="dzest(this);return false" class="link" name="dzest" style="font-weight:normal; display:inline;">Izdzēst</a><br/>').appendTo('#input_lauki')
    $('.link').css('display','inline');

});

or live if you're using an old version of jQuery, since it has some special handling that you should read about in the docs.

$.on needs to be applied to a selected element: the example should read `$('#input_lauki').on('change', 'input[type=file]'` — Morgan Bruce, Apr 26 '12 at 08:31

Fabrizio Calderan · Answer 2 · 2012-04-26T08:28:43.333

0

when you defined your change event handler you had a defined amount of input file, so the new input you insert later have no handler defined for that event.

you should instead capture the event to the parent #input_lauki

$("#input_lauki").on('change', 'input[type=file]', function() {
 ...
}

example fiddle: http://jsfiddle.net/TwWEt/

edited Apr 26 '12 at 08:28

answered Apr 26 '12 at 08:22

Fabrizio Calderan

120,726
26
164
177

score -1 · Answer 3 · edited Jul 21 '12 at 12:20

-1

You could try

$('input[type=file]').on('change',function(){

 //your code


});

edited Jul 21 '12 at 12:20

mplungjan

169,008
28
173
236

answered Apr 26 '12 at 08:19

DRAKO

112
1
2
9

`live` is deprecated on newer jquery version. you should use `on()` instead – Fabrizio Calderan Apr 26 '12 at 08:22

appendTo objects wont take action on jquery change

3 Answers3