Weight mask

Question

Searching the internet, I found a code that masks weight in the field. But this code works with ID criteria.

I would like it to work with CLASS, to be able to use in other fields.

function id(el){
        return document.getElementById(el);
}
window.onload = function(){
        id('peso').onkeyup = function(){
            var v = this.value,
                integer = v.split('.')[0];


            v = v.replace(/\D/, "");
            v = v.replace(/^[0]+/, "");

            if(v.length <= 3 || !integer)
            {
                if(v.length === 1) v = '0.00' + v;
                if(v.length === 2) v = '0.0' + v;
                if(v.length === 3) v = '0.' + v;
            } else {
                v = v.replace(/^(\d{1,})(\d{3})$/, "$1.$2");
            }

            this.value = v;
        }
};

Answer 1

I imagine your problem includes dynamically Genaro fields, and hence you need to use delegation. My suggestion is:

function mascara() {
    var v = this.value, integer = v.split('.')[0];
    v = v.replace(/\D/, "");
    v = v.replace(/^[0]+/, "");

    if (v.length <= 3 || !integer) {
        if (v.length === 1) v = '0.00' + v;
        if (v.length === 2) v = '0.0' + v;
        if (v.length === 3) v = '0.' + v;
    } else {
        v = v.replace(/^(\d{1,})(\d{3})$/, "$1.$2");
    }

    this.value = v;
}
$('#elementoPai').on('keyup', '.peso', mascara);

If you add more information about how you want to format the output we can help you adapt the mask.

Answer 2

In place of

function id(el){
    return document.getElementById(el);

}

Place

function id(el){
   return document.getElementsByClassName(el);
}

And puts a class with the name 'weight' in its element.

Answer 3

You can directly use jQuery for this if you are not using dynamically generated fields:

$('.peso').keyup(function () {
    var v = this.value,
        integer = v.split('.')[0];

    v = v.replace(/\D/, "");
    v = v.replace(/^[0]+/, "");

    if (v.length <= 3 || !integer) {
        if (v.length === 1) v = '0.00' + v;
        if (v.length === 2) v = '0.0' + v;
        if (v.length === 3) v = '0.' + v;
    } else {
        v = v.replace(/^(\d{1,})(\d{3})$/, "$1.$2");
    }

    this.value = v;
});

I also suggest changing the line

v = v.replace(/\D/, "");

for

v = v.replace(/\D/g, "");

To correctly remove the letters.