CODEWITHSUNDEEP
jquery-inputmaskinput-mask
HarlemSquirrel
HarlemSquirrel

Reputation: 10194

Text placeholder for currency input using Inputmask

I want to have a text placeholder for a currency input field using Input mask.

When the input value is empty, I want to display "Other" but as soon as the user begins typing it should mask the input to US dollars. 

$(function() {
  $('#otheramount').inputmask({
    alias: 'currency',
    digits: 2,
    rightAlign: 0
  })
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/RobinHerbots/[email protected]/dist/jquery.inputmask.bundle.js"></script>

<input id="otheramount" placeholder="Other" name="otheramount" data-_extension-text-contrast="" type="text">

The placeholder option is for masked input characters not for when the value of the input is empty.

Upvotes: 0

Views: 4553

Answers (1)

HarlemSquirrel
HarlemSquirrel

Reputation: 10194

Use the clearMaskOnLostFocus option

$(function() {
  $('#otheramount').inputmask({
    alias: 'currency',
    digits: 2,
    rightAlign: 0,
    clearMaskOnLostFocus: true
  })
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/RobinHerbots/[email protected]/dist/jquery.inputmask.bundle.js"></script>

<input id="otheramount" placeholder="Other" name="otheramount" data-_extension-text-contrast="" type="text">

Upvotes: 2

Related Questions