How to Use Regular Expressions in Lightning Web Component?
Sample Code:
CardValidation.html
======================
<template>
<lightning-input label="Enter the card number" class="Card">
</lightning-input>
<lightning-button label="Submit" onclick={handleValidation}>
</lightning-button>
</template>
CardValidation.js
====================
import { LightningElement } from 'lwc';
export default class CardValidation extends LightningElement {
handleValidation(){
const CardRegex="[A-Z]{5}[0-9]{4}[A-Z]{1}";
let Card=this.template.querySelector(".Card");
let CardVal=Card.value;
if(CardVal.match(CardRegex)){
Card.setCustomValidity("");
}else{
Card.setCustomValidity("Please Enter a Valid Card Number");
}
Card.reportValidity();
}
}
Follow Us