Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

176
Visualizações
how to validate date based on input type text and display the day according to input date in react

I want to validate the data according to day month and year and print the day according to an input value.

class Inputdate extends React.Component {
       state={
           inputDate:''
       }
    
     
   render() {
          console.log(this.state)
        return (
          <div>
            <input
                name="date"
              type="text"
              value={this.state.value}
              placeholder="dd-mm-yyyy"
              onChange={(e)=> this.setState({inputDate : e.target.value})}
            />
            <p>{this.state.inputDate}</p>
          </div>
        );
      }
    }
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

You can do this in multiple ways. I have listed some ways you can validate your date.

Solution 1

function isValidDate(inputDate) {
    return !isNaN(Date.parse(inputDate);
}

Solution 2


function isValidDate(inputDate) {
    const date_regex = /^(0[1-9]|1\d|2\d|3[01])-(0[1-9]|1[0-2])-(19|20)\d{2}$/;
    return date_regex.test(inputDate)
}

function getDay(date) {
  const days = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];
  if (isValidDate(date)) {
    const myDate = new Date(date);
    
    return days[myDate.getDay()];
  }
  
  return "Invalid Date"
}

console.log(getDay('12-01-1994'));

console.log(getDay('12-01-0001'));

In your case

function isValidDate(inputDate) {
    return !isNaN(Date.parse(inputDate);
}
class Inputdate extends React.Component {
       state={
           inputDate:''
       }
    
     
   render() {
          console.log(this.state)
        return (
          <div>
            <input
                name="date"
              type="text"
              value={this.state.value}
              placeholder="dd-mm-yyyy"
              onChange={(e)=> {
                 if(isValidDate(e.target.value)){
                    this.setState({inputDate : e.target.value.replace('-', '/')})
                 }
              }}
            />
            <p>{this.state.inputDate}</p>
          </div>
        );
      }
    }
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda