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

203
Visualizações
GlobalFilter on Date in REACT-Table

I want to filter the Date, but my problem is that I have to give the Date unformatted to the React-Table because of the sort-Function. So I define my Column like this:

 {
    Header: "ORDER_DATE",
    accessor: "creationDate",
    sortable: true,
    Cell: ({value})=>{return format(new Date(value),'dd.MM.yyyy')}
 }

I give the Date in this format to the Column: "2021-09-20T00:00:00+0000". Adding the format Function to the Cell-Property, means that I write the unformatted Date to the Table but it will be displayed formatted. Now I have my globalFilter where I can filter with an InputField. The formatted Date has this format: dd.MM.yyyy and unformatted it is like this: yyyy-mm-dd. My idea was to split and convert it. Here my code

const formatWhenDate = (value) => {
        return value.split(".").reverse().join("-");
 }

<input
        id="test"
        onChange={(e) =>{ setInput(e.target.value);setFilter(formatWhenDate(e.target.value));}}
 />

It also works, but only when I enter the full month and Year because I can´t change for example: 17.0 to 0X-17 (X is a placeholder for a empty value).

Does know somebody how to handle it in relation to the React-Table or does somone could edit my function(formatWhenDate) so that also dates with not full month(11.0 intead of 11.09) or years(20 instead of2021 will be filtered correctly?

about 4 years ago · Juan Pablo Isaza
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