Use this tag with questions concerning Cleave.js package for data entry and data formatting. Along with this tag also specify tags such as [reactjs] or [angular] or [jsfiddle] or [formik] to specify the JavaScript library being used with Cleave.
Questions tagged [cleave]
27 questions
6
votes
1 answer
Cleave.js Phone CA
I'm trying to format a phone number field using Cleave.js and it's not working but I can't seem to figure out why.
I started off like this:
import Cleave from 'cleave.js';
var cleave = new Cleave('.phone', {
'phone': true,
…

Chin Leung
- 14,621
- 3
- 34
- 58
4
votes
2 answers
Setting max value in cleave
I'm using cleave.js for a date input field in my Vue.js project.
The option that I passed was this:

Jack
- 41
- 1
- 2
3
votes
0 answers
Why does Cleave numeral formatting stop after two decimal places?
I am trying to format in input field using a Cleave component which groups the raw input value into thousands. I am using React JS.

Johan Jansen van Vuuren
- 75
- 1
- 8
2
votes
1 answer
Vue3 Cleave js not working if not using v-model.lazy
Currently i try to use cleavejs to formatting thousand separator my input number, it's show strange behavior when i input 1000.123 it show 1,000.12 which is correct format, but my v-model value is 1000.123 not 1000.12. other people suggesting using…

Kangkung Gamers
- 23
- 3
2
votes
2 answers
How to format the phoneNumber without using HTML
I am using Cleave.js with Node.js. Here I am getting document not defined error. How to resolve this issue?
var express = require('express');
var app = express();
var document = require('html-element').document;
var Cleave =…

Dinesh
- 21
- 5
2
votes
1 answer
How can I pass cleave js format to formik Field
I am using Formik with yup validations and Its working perfectly. What I'm trying to do is I want to integrate cleavejs for formatting like numerical format. The problem is when my formik Field change to Cleave then the format is working however it…

Rye
- 179
- 3
- 17
2
votes
1 answer
How can I combine cleave.js with element in Vue?
I am using Vue.js 2 with Element and I would like to make use of Cleave.js for masking.
I understand how to make a basic masker in Vue, using data and computed properties. However I don't want to redo all the good work done in Cleave.
I have also…

Daryn
- 3,394
- 5
- 30
- 41
2
votes
0 answers
Cleave.js PhoneFormatter not working
I'm trying to implement Cleave.js with MooTools.js but although I'm doing it correctly (or so I believe, the implementation is very simple) I can't seem to get it to work no matter what.
I also tried testing in a website given by a contributor from…

James
- 679
- 1
- 8
- 22
1
vote
2 answers
Cleave.js pattern DD.MM.YYYY
How to add a trailing dot to Cleave.js date pattern (DD.MM.YYYY.)?
So valid input would be: 04.05.2023.
new Cleave('.my-input', {
date: true,
datePattern: ['Y', 'm', 'd'],
delimiter: '.'
});
// outputs: DD.MM.YYYY - without the final…

davidm
- 1,570
- 11
- 24
1
vote
0 answers
Two formats for same input with cleave.js
We have an input inside a modal and this field must have a mask. The mask may be two types defined by what button the user press. As code shown below, please consider expected formats to be 11-11-11 and 111.111.111.
When the modal opens the first…

rd1218
- 134
- 12
1
vote
1 answer
Cleave.js error in getPostDelimiter() when entering first character into input
While implementing cleave.js for credit card formatting of an input field created as a custom element using litElement I ran into this error when I type the first character into the input but no issue with subsequent characters.
cleave-esm.js:712…

Capsule42
- 11
- 1
1
vote
0 answers
Contact Form 7 and Cleave.js. Phone number input field
Thank you for paying attention to my question.
I am making a website for myself on WordPress, in parallel I am learning programming. I ask you to help sort out one point. I have implemented a contact form based on the Contact Form 7 plugin. I…

Bergaul
- 11
- 2
1
vote
3 answers
Property 'rawValue' does not exist on type 'EventTarget & HTMLInputElement' error while using typescript with cleave.js
I am having the above error in onChange event while using cleave with typescript. Ts throws error stating it doesn't have 'rawValue' in event.target.
My code is as below:
import React, { useCallback, useState, useEffect, useMemo } from…

Shivangi Khandelwal
- 113
- 1
- 1
- 12
1
vote
1 answer
How do I ignore TS1192 when using @types/cleave.js in my angular project?
I am using cleave.js (^1.5.2) in an Angular 6 application along with the @types/cleave.js package (^1.4.0) and an odd thing is happening. If I run ng build to build the application it fails with the following errors:
ERROR in…

Evan C
- 141
- 10
1
vote
1 answer
How to use cleave.js as a Formik field?
I'd like to use a Cleave (see https://nosir.github.io/cleave.js/ for details) as a Field inside a Formik form. While built-in components like text inputs work fine, the Cleave value change is not recorded and furthermore reset if any other value is…

Kalle Richter
- 8,008
- 26
- 77
- 177