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

Asked

Viewed 253 times

1

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

Any idea how to make one 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);

jQuery field duplication 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();        
    }
});

1 answer

1


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

I changed an excerpt of your code to: http://jsfiddle.net/ag9p2tvj/10/

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

I don’t know if taking the element by Class will give some problem... but this way tb works.

  • Excellent! Thanks, solved the problem. Abs!

  • I changed your post with the new jsFiddle, ok?

  • I just put too... but thanks!!!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.