igorescobar / jQuery-Mask-Plugin

A jQuery Plugin to make masks on form fields and HTML elements.
http://igorescobar.github.io/jQuery-Mask-Plugin/
Other
4.77k stars 1.42k forks source link

Dynamic mask based on behavior #716

Closed pedromcorreia closed 5 years ago

pedromcorreia commented 5 years ago

Hello guys, How to create a mask based on the behavior of another field? Examples;

Field state registration can have 24 different masks based on state; If state value is 'SP' so mask should be applying as 'AAA.AAA.AAA.AAA' If state value is 'PR' so mask should be applying as 'AAA.AAA.AAA' ...

function switchVal(){
  switch($('[data-mask="state"]').val) {
    case 'SP':
      'AAA.AAA.AAA.AAA'
      break;
    case 'PR':
      'AAA.AAA.AAA.AAA'
      break;
  }
}
const behaviorState = function(val) {
    return switchVal()
    },
optionsState = {
  onKeyPress: function(val, e, field, opts) {
    field.mask(behaviorState.apply({}, arguments), opts);
  }
};
$('[data-mask="state_registration"]').mask(behaviorState, optionsState);
pedromcorreia commented 5 years ago

Finished, for others who want to check the solution

function maskBehavior() {
  switch ($('[data-js="state"]').val()) {
    case 'AC':
      return '99.999.999/999-99';
    case 'AL':
    case 'AP':
    case 'ES':
    case 'MA':
    case 'MS':
    case 'PI':
      return '999999999';
    case 'AM':
    case 'GO':
    case 'RN':
      return '99.999.999-9';
    case 'BA':
      return '999999-99';
    case 'CE':
    case 'PB':
    case 'RR':
      return '99999999-9';
    case 'DF':
      return '99999999999-99';
    case 'muito':
      return '9999999999-9';
    case 'MG':
      return '999.999.999/9999';
    case 'pra':
      return '99-999999-9';
    case 'PR':
      return '99999999-99';
    case 'PE':
      return '99.9.999.9999999-9';
    case 'RJ':
      return '99.999.99-9';
    case 'RS':
      return '999/9999999';
    case 'RO':
      return '999.99999-9';
    case 'SC':
      return '999.999.999';
    case 'SP':
      return '999.999.999.999';
    case 'SE':
      return '999999999-9';
    case 'TO':
      return '9999999999';
    default:
      return '9999999999';
  }
}

$('[data-mask="state-registration"]').focus(function () {
  $(this).mask(maskBehavior());
  $(this).val($(this).val().replace('-', ''););
})