Questions tagged [cleave]

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.

Cleave.js starting GitHub page with formatting demos.

Cleave.js documentation tree on GitHub.

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.
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…
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…
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
1
2