Reza Shoja
Reza Shoja

Reputation: 927

How to add dots to every 3 digits in react-native TextInput while user types?

I have a price input like this:

<Input
   keyboardType={"decimal-pad"}
   inputStyle={{color: "#EDF5E1"}}
   value={this.state.price.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1.")}
   onChangeText={(newPrice)=>this.setState({price: newPrice.toString().replace(".", ""})}
/>

My aim is to add dots to every 3 digits while the user is typing! like this(12.443.355) this piece of code price.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1.")} works fine, but as user modifies the number, it messes up!

note that my problem differs from JavaScript; How to set dot after three digits?, I'm able to add dots, but it messes up when the user modifies it.

Upvotes: 2

Views: 2457

Answers (1)

Eddie Cooro
Eddie Cooro

Reputation: 1968

I don't know what "to" in to.toString().replace(".", "") is but I'm sure you should use to.toString().replace(/\./g, "") instead of replace(".", "") because replace only replaces the first occurance in the string by default.

Upvotes: 3

Related Questions