Masquerade jQuery does not work on duplicate element - same class, same id

1

I'm using the jQuery-Mask-Plugin mask option and I use a field duplication code; however, when duplicating the element, the mask does not follow, that is, the new element (duplicate) does not bring the mask of the source element.

Any idea how to do a reload in jQuery for the mask to be applied?

Follow the fiddle:

jsFiddle - Duplicate Fields

Mask Code:

    var maskBehavior = function (val) {
  return val.replace(/\D/g, '').length === 11 ? '(00) 00000-0000' : '(00) 0000-00009';
},
options = {onKeyPress: function(val, e, field, options) {
        field.mask(maskBehavior.apply({}, arguments), options);
    }
};

$('.phone').mask(maskBehavior, options);

Field duplication jQuery code:

$(document).ready(function (){
    clone_obj = function(obj_name, obj_destination) {
        $('#' + obj_name).clone().appendTo('#' + obj_destination).find("input[type='text']").val('');        
    }

    delete_obj = function(obj_name, group) {
        $(obj_name).closest('#' + group).remove();        
    }
});
    
asked by anonymous 13.05.2015 / 16:12

1 answer

1

A tip and you change the ID for each new field added ... but the problem is not this one. You need to re-apply the mask for each new field created, that is, every time a new element is created you have to apply: $ ('# NOVOID'). Mask (maskBehavior, options);

I've changed a portion of your code to: link

 clone_obj = function(obj_name, obj_destination) {
        $('#' + obj_name).clone().appendTo('#' + obj_destination).find("input[type='text']").val('');
       $('.phone').mask(maskBehavior, options);        
    }

I do not know if getting the element through Class will give you a problem ... but this way it works.

    
13.05.2015 / 16:24