Problem with format a time from field. React

Question

I need to get time in "00:00:00" type. I have field to do this, but if I get 00 in last place I have "02:02". I try to use time.lenght, and I want to add missing number, buti it is dosn't work...

<input id="preparation_time"  defaultValue = "00:00:00" type="time" step="1" className={styles.input} onChange={e => this.order.preparation_time = e.target.value}/>

and I have in console when I click submit only "02:02: not "02:02:00:

  async submit(){
this.setState({error : false});
this.setState({response : false});

console.log(this.order.preparation_time);
(..)

If I enter seconds, they are but if I enter zero, they disappear and I don't know how to add these zeros. I can't get the length.

Sory I wrote lenght, no length. But if whos want to know why is no second. Answer is below.

could you add more code of your components? and what do you mean by 20:02? I don't see any "20:02" — pmiranda
– pmiranda, Commented Jun 3, 2021 at 16:40
How I can get time in "00:00:00" format? <-- where, in console.log? in rendered? explaing better your question — pmiranda
– pmiranda, Commented Jun 3, 2021 at 16:48

AbhishekGowda28 · Accepted Answer · 2021-06-04 04:17:38Z

1

Different browsers have different implementation for time type. Chrome skips/ doesn't consider seconds value if its 0 seconds. Mean while firefox considers complete time which has been provided.

If you need to maintain consistency you could add the seconds when you see that length of the time value is less than 8.

if(e.target.value.length < 8) {
 this.order.preparation_time = e.target.value + ":00"
}

answered Jun 4, 2021 at 4:17

AbhishekGowda28

1,09412 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Mariusz Szczerba Over a year ago

Yes. I don't know this. I wrote <6 but this is the same for me. 00:00 is 5

Collectives™ on Stack Overflow

Problem with format a time from field. React

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related