0

i wonder how i can format automatically input value in react for the money based values.

So i want to allow this type values:

eg: if user will wan't to write;

20 - it will be 20.00 if 1000, it will be 1,000.000

I wan't to prevent any other user inputs and show error if so. How i can do it in react?

I'm using react-table so my input some editable cell. Because of it's div behave like input: I Tried this: 

<div
          className="coastInput"
          contentEditable
          onBlur={e => {
            const re = /^[0-9\b,.]+$/;
            if (e.target.innerHTML == "" || re.test(e.target.innerHTML)) {
              this.setState({
                isError: false
              });
              const data = [...this.state.data];
              data[cellInfo.index][cellInfo.column.id] = e.target.innerHTML;
              this.setState({ data });

              editedData.push({
                total: this.state.data[cellInfo.index][cellInfo.column.id],
                id: cellInfo.row._original.id,
              });
            } else {
              return (
                this.setState({
                  isError: true
                }),
                alert("Just numbers allowed")
              );
            }
          }}
          dangerouslySetInnerHTML={{
            __html: this.state.data[cellInfo.index][cellInfo.column.id]
          }}
        />
user3348410
  • 2,733
  • 10
  • 51
  • 85
  • If you want to use a library, you can use something like text mask: https://github.com/text-mask/text-mask Check out the demo page, there are some examples with currency – Wolfie Jun 24 '19 at 19:51
  • It will be more nice if i will not use plugin because there is i'm not so free for using that – user3348410 Jun 24 '19 at 20:25

0 Answers0