0

Como recupero o value do input data? Meu objetivo é o value ser conforme a data selecionada no campo.

Campo para filtrar

Campo do filtro:

<div class="filt-nam">
        <h5>Filtrar Itinerários por Data: </h5>
      </div>
      <div class="row align-items-center">
        <div class="col-sm-6">
          <div class="input-group">
            <input type="date" class="form-control" id="dataInicio" value="" />
            <input type="date" class="form-control" id="dataFim" value="" />
            <div class="input-group-append">
              <button class="btn btn-outline-secondary" type="button" onclick="filtrarData()">Filtrar</button>
            </div>
          </div>
        </div>

Arquivo JS:

function filtrarData() {
    let dataInicio = document.getElementById('dataInicio')
    let dataFim = document.getElementById('dataFinal')

    console.log(dataInicio.value, dataFim.value)
};
3
  • 1
    Vc trocou dataFim por dataFinal.
    – Sam
    3/02/2019 às 16:11
  • A final, qual o real objetivo da pergunta? É corrigir o erro de um único campo, como o Sam mencionou e o André Filipe respondeu ou formatar o campo, como o Luiz Felipe respondeu? Qual o erro apresentado? O que acontece de forma inesperada? Deveria apontar seu objetivo pra evitar perguntas do tipo "chute"...
    – LipESprY
    3/02/2019 às 16:21
  • Vamos aguardar a resposta do Felipe Noka. 3/02/2019 às 23:02

2 Respostas 2

2

De acordo com a documentação, o <input> do tipo date sempre retornará uma string no formato AAAA-MM-DD, ou seja, ano, mês e dia.

Você precisa criar uma função para transformar a data no formato AAAA-MM-DD para DD/MM/AAAA:

const field = document.querySelector('#date-field')

function formatDate(date) {
  const [, year, month, day] = date.match(/^(\d{4})-(\d{2})-(\d{2})$/)
  return `${day}/${month}/${year}`
}

field.addEventListener('change', (event) => {
  console.log(`Sem formatação: ${event.target.value}`)
  console.log(`Com formatação: ${formatDate(event.target.value)}`)
})
<input type="date" id="date-field" />

Referência:

2

Como recupero o value do input data?

Fazendo uma breve análise de seu código vi que está estruturado corretamente, porém, na segunda variável dataFim você está dando um document.getElementById('dataFinal'), uma vez que esse Id não existe em seu código HTML o console.log irá lançar a seguinte exceção pois a sua variável dataFim estará nula:

Uncaught TypeError: Cannot read property 'value' of null

Você poderia alterar o seu código Javascript para:

let dataFim = document.getElementById('dataFim')

ou seu HTML para:

<input type="date" class="form-control" id="dataFinal" value="" />

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .