Updating date and clock

Question

Updating date and clock

Navigation

#1 by (0 votes)

0

I am creating a clock from an informed value, the problem is that the clock is not being updated.

The other problem is that in the inverted view, the month is coming first than the day.

What am I doing wrong? This "Today" value appears correctly and comes from the server, I can not get the value of the client because of the risk of changing the date of the computer.

function relogio() {

    var valor = document.getElementById('Hoje').value;

    var data = new Date(valor);

    var dia = data.getDate();
    var mes = data.getMonth() + 1;
    var ano = data.getFullYear();


    var horas = data.getHours();
    var minutos = data.getMinutes();
    var segundos = data.getSeconds();


    if (dia < 10) {
        dia = "0" + dia;
    }
    if (mes < 10) {
        mes = "0" + mes;
    }
    if (horas < 10) {
        horas = "0" + horas;
    }
    if (minutos < 10) {
        minutos = "0" + minutos;
    }
    if (segundos < 10) {
        segundos = "0" + segundos;
    }

    var dataAtualizada = dia + '/' + mes + '/' + ano + ' ' + horas + ':' + minutos + ':' + segundos;

    document.getElementById('relogio').innerHTML = dataAtualizada;
}

window.setInterval(relogio(), 1000);

javascript jquery javascript-eventos

asked by anonymous 07.12.2018 / 13:20

1 answer

Matlab Directory Change Place marked in address search - Geocoding api

score 0 · Accepted Answer

Ok, follow the code.

document.getElementById('relogio').value = document.getElementById('Hoje').value

function relogio() {
    var valor = document.getElementById('relogio').value.split(' '); //divide dia/horário
    var dia = valor[0].split('/').reverse().join('-'); //converte a data em formato americano
    valor = dia + ' ' + valor[1]; //une a data americana com o horário
    var data = new Date(valor); // cria o objeto de data
    var atualizado = data.setSeconds(data.getSeconds() + 1) // adiciona um segundo
    atualizado = new Date(atualizado) //cria a data atualizada
    document.getElementById('relogio').value = atualizado.toLocaleDateString('pt-BR', {hour: 'numeric', minute: 'numeric', second: 'numeric'}); //atualiza a data já editada pro formato solicitado
}

setInterval(relogio, 1000) //roda a cada 1 segundo.

<input class="form-control input-print larg" type="text" id="Hoje" style="display:none" value='12/07/2018 11:30:00'/>
<input class="form-control input-print" id="relogio" type="text" readonly>

Your main mistake was to receive the time of a string, but do not increase it by a second. If you get the server's time and put inside an html tag inside the page, you need to ensure that it will be updated by the server, or by javascript. Since the server does not update, we edit the string to place in a date object, add a second to its value, and return the string to the original value. I will leave some links so that you can study and understand what was done, but I believe that with the comments you can have a notion.

I just want to make it clear that the clock will update on the front end, so if the server time is modified the page needs to be reloaded.

Useful links:

.toLocaleDateString ()

Date Object