Save date and time of start of task with button and insert in mysql

Question

I have the following form that correctly inserts in the database by clicking the button:

$("#form").submit(function(e){ 
	 $.ajax({
      type: "POST",
      url: "./conexaoteste",
      data: $("#form").serialize(), // serializes the form's elements.
          dataType: "json",
          success: function (data)
           {			
												 
           }, 
          error: function(data){
					 $(".error_message").removeClass('hide'); // error message
           },
					
   });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form method="POST" id="form"> 
<input type="hidden" id="codigo" name="codigo" value="<?= $_GET['codigo'] ?>" />
<div class="form-group">
<label class="col-md-4 control-label" for="PequenoAlmoco" id="acao"></label>
<div class="col-md-4">
    <input type="hidden" id="PequenoAlmoco" name="tarefa" value="Pequeno Almoço">
</div>
</div>
<button class="btn btn-info">Pequeno Almoço</button>
</form>

php:

$codigo = mysqli_real_escape_string($conn, $_POST["codigo"]); 
$PequenoAlmoco = mysqli_real_escape_string($conn, $_POST["tarefa"]);    

$sql = "INSERT INTO teste (`codigo`, `tarefa`)
VALUES ('$codigo', '$PequenoAlmoco')";

$result = mysqli_query( $conn, $sql);

This works correctly, but if you add the button to save the date and time of the start of the task by clicking the button, you no longer insert by clicking the task button.

code:

function formatDate(date) {
var monthNames = [
"Janeiro", "Fevereiro", "Março",
"Abril", "Maio", "Junho", "Julho",
"Agosto", "Setembro", "Outubro",
"Novembro", "Dezembro"
  ];

  var day = date.getDate();
  var monthIndex = date.getMonth();
  var year = date.getFullYear();
  var hours = date.getHours();
  var min = date.getMinutes();
  var sec = date.getSeconds();

  return year + '-' + (monthIndex+1) + '-' + day + ' ' + hours + ':' + min + ':' + sec;
}


var dtTime;
$('#IniciarTarefa').on('click', function () {
   $(this).closest('.form-group').data('inicio', formatDate( new Date() ) );
});

$("#form").submit(function(e){ 
	$.ajax({
     type: "POST",
     url: "./conexaoteste",
     data: $("#form").serialize(), // serializes the form's elements.
     dataType: "json",
     success: function (data)
       {			
			 }, 
     error: function(data){
			 $(".error_message").removeClass('hide'); // error message
     },
					
 });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form method="POST" id="form"> 
<input type="hidden" id="codigo" name="codigo" value="<?= $_GET['codigo'] ?>" />	
<div class="form-group">
<label class="col-md-4 control-label" for="IniciarTarefa" id="acao"></label>
<div class="col-md-4">
<button id="IniciarTarefa" name="IniciarTarefa" class="btn btn-info">Iniciar Tarefa</button>
</div>
</div>		
<div class="form-group">
<label class="col-md-4 control-label" for="PequenoAlmoco" id="acao"></label>
<div class="col-md-4">
<input type="hidden" id="PequenoAlmoco" name="tarefa" value="Pequeno Almoço">
</div>
</div>
<button class="btn btn-info">Pequeno Almoço</button>
</form>

php:

$codigo = mysqli_real_escape_string($conn, $_POST["codigo"]); 
$IniciarTarefa = mysqli_real_escape_string($conn, $_POST["IniciarTarefa"]);
$PequenoAlmoco = mysqli_real_escape_string($conn, $_POST["tarefa"]);    

$sql = "INSERT INTO teste (`codigo`, `IniciarTarefa`, `tarefa`)
VALUES ('$codigo', '$IniciarTarefa', '$PequenoAlmoco')";

$result = mysqli_query( $conn, $sql);

The idea is, click the Start Task button, and save the date and time in the value of the button or a variable and then when clicking the button with the task name (breakfast) enter the code of the first input, the date and time I started the task and the task name.

Answer 1

I didn’t understand exactly, but I’ll try to answer

click on your database then go to sql puts this command:
ALTER TABLE SUA_TABELA ADD data datetime;
^^ it will add a date column in your table $now = new DateTime(); $datetime = $now->format('Y-m-d H:i:s');
^^ it will pick up current date, time, minutes and seconds $sql = "INSERT INTO teste (codigo, IniciarTarefa, tarefa,data) VALUES ('$codigo', '$IniciarTarefa', '$PequenoAlmoco','$datetime')";

Answer 2

Good evening, I don’t know if I understood you right but you can store variables in localStorage with javascript, it’s better to save the date and time in the value of the button as you said!

// Armazenar.
localStorage.setItem("nome", "LUIZ");
// Recuperar.
nomeTela = localStorage.getItem("nome");
//Limpar.
localStorage.clear();

This data gets saved only during browser session ie when you close the data get lost.

Check that your date is being passed correctly to Mysql in the format y-m-d or y/m/d.