how to applique a mask on an Alertify.js prompt

Question

Is there a way to applique a mask on a Alertify.js prompt ?

I need to add on a jquery maska like this :

$('document').ready(function(){
  $('.car_number').mask('(SSS-0000');
  });

On an alertify.js prompt like this :

alertify.prompt( 'test', 'Insert a car number', '', function(evt, value) {
               if(value) {
                   getVal(value);
                   }
                }
               , function() {})
}

to get an output like :

PCT-5077

Any help is welcome.

Are you saying that you want the output to display in the specific format only or are you looking to also change the way that the information is entered by the user? — vbguyny, Nov 17 '16 at 20:04
Yes i want that the user can enter only 3 letters and 4 numbers in this order. — evergoo, Nov 17 '16 at 20:15
It doesn't look like Alertify supports this. The only thing that I recommend would be to manually patch the Alertify script to support the mask ability. — vbguyny, Nov 17 '16 at 20:20

score 2 · Accepted Answer · answered Nov 27 '16 at 11:32

As long as you have acces to the DOM, you can do what ever you want:

function show(){
  var prompt = alertify.prompt();
  prompt.set({
   'onshow': function(){
    var input = this.elements.content.querySelector('input');
    //customize the input as you please
    $(input).mask();
    },
    'onclose':function(){
      var input = this.elements.content.querySelector('input')
      //clear the customization as this is a singleton.
      //$(input) 
    }
  })
  .show();
}

But remember, the default AlertifyJS prompt is a singleton, so its better to clear the customization on close.

1

Thanks a lot, its perfect ! – evergoo Nov 28 '16 at 11:48

how to applique a mask on an Alertify.js prompt

1 Answers1