close

# Input Masks

An inputmask helps the user with the input by ensuring a predefined format. This can be usefull for dates, numerics, phone numbers, ...

##### Date

Date

    <label for="inputMask1" class="form-label">Date</label>
    <input type="text" class="form-control" aria-label="Date" id="inputMask1" data-inputmask-inputformat="dd/mm/yyyy" data-inputmask-alias="datetime">

    $("#inputMask1").inputmask();

##### IP address

IP address

    <label for="inputMask3" class="form-label">IP address</label>
    <input type="text" class="form-control" aria-label="IP address" id="inputMask3" data-inputmask="'alias': 'ip'" inputmode="numeric">

    $("#inputMask3").inputmask();

##### Currency

Amount

    <label for="inputMask2" class="form-label">Amount</label>
    <input type="text" class="form-control" aria-label="Amount" id="inputMask2" data-inputmask="'alias': 'numeric', 'groupSeparator': ',', 'digits': 2, 'digitsOptional': false, 'prefix': '$ ', 'placeholder': '0'" inputmode="decimal" style="text-align: right;">

    $("#inputMask2").inputmask();

##### Email

Email

    <label for="inputMask4" class="form-label">Email</label>
    <input type="text" class="form-control" aria-label="Email" id="inputMask4" data-inputmask="'alias': 'email'" inputmode="email">

    $("#inputMask4").inputmask();