CODEWITHSUNDEEP
angularionic-frameworkionic3
Brian Moreno
Brian Moreno

Reputation: 1027

Empty AlertController Input - Ionic

I want to empty an alert input if the user tried to paste a string in the textbox. This is my code:

openManualEdit () {
  let myAlert = this.alertCtrl.create({
      title: 'Ingreso Manual',
      message: 'Ingresa el código de barra en los campos debajo.',
      inputs: [
        {
          name: 'serial',
          placeholder: 'Número de serie',
          id: 'txtSerial'
        },
        {
          name: 'serial_confirm',
          placeholder: 'Confirma el número de serie',
          id: 'txtSerialConfirm'
        }
      ],
      buttons: [
        {
          text: 'Cancel'
        },
        {
          text: 'Continue',
          handler: (data) => {
            console.log(data);
        }
      }
    ]
  });
  myAlert.present().then(() => {
    // Empty textbox if user tries to paste
    document.getElementById('txtSerial').addEventListener('paste', function (event) {
      console.log(event);
      (<HTMLInputElement>event.target).value = '';
    });

 // Empty textbox if user tries to paste
 document.getElementById('txtSerialConfirm').addEventListener('paste', function (event) {
      // console.log(event);
      (<HTMLInputElement>event.target).value = '';
    });
  });
}

So far I'm detecting the paste event, but the code to empty the textbox isn't working. I've also tried using:

But none of these seem to work. Any help is greatly appreciated.

Upvotes: 2

Views: 425

Answers (1)

AVJT82
AVJT82

Reputation: 73357

You can just use event.preventDefault() inside the event listeners. That will not allow pasting. 

document.getElementById('txtSerial').addEventListener('paste', function (event) {
  console.log(event);
  event.preventDefault();
});

DEMO

Upvotes: 1

Related Questions