I do not know why after adding new input, Masked Input Plugin does not work on it(new input)?
Example: http://jsfiddle.net/yx5wa/1/
$('a.add_input').live('click', function (event) {
event.preventDefault();
var newDiv = $($(this).closest('.adding').get(0)).clone(true);
$(this).closest('.adding').find('.add_input').remove()
newDiv.find('.adda').not(':has(.remove_input)').append('<div class="mediumCell"><a href="" class="remove_input">remove</a></div>')
newDiv.hide().fadeIn('slow')
$('.adding:last').after(newDiv);
$('.adding' + ':last input:checkbox').prop('name', 'checkbox_units[' + size_un + '][]');
console.log($('.adding:last input:checkbox').prop('name'));
});
It looks like there were two issues:
The plug-in needs to be applied again to the new input within your click event:
The
clonefunction needs to be called withwithDataAndEventsset to false:It seems like you were trying to clone the input and then use
.clone(true)to bring the mask functionality along for the ride (right?). Unfortunately, it looks like this won’t work. You can see in this fiddle, when I try and clone the input, it looks like references to the original input are still stuck in there, creating some strange behavior.