make a search between two data php html mysql

Question

I need help with a search between two dates.... I am entering an initial date and a final , but I need to return the result on another page .... however my return is always from the customer registered on the date 0000-00-00.... it is as if my inputs return empty; I do not know if it is something simple to be solved , because I am taking my first steps in the area of programming in general, but I believe it can be some problem as my js.

function retornaOs() {

  $.ajax({
    type: "POST",
    crossDomain: true,
    url: bd+'/consulta.php',
    dataType: "JSON",
    async: false,
    beforeSend: function (xhr) {
      app.dialog.preloader('Buscando os');
    },
    success: function (result) {
      var data = JSON.parse(result);
      var htmlos = "";
      console.log(data);
      $.each(data, function (i, item) {

        htmlos = '<li class="click-usuario" >'+
        '<a href="/DadosUsuario/" class="item-link item-content">'+
        '<div class="item-inner">'+
        '<div class="item-title">'+
        '<div class="item-header">Name</div>'+
        '| '+ 
        item.nome+
        '</div>';
        $("#lista-os").append(htmlos);
      });
    },
    error: function () {
      app.dialog.preloader('Erro ao buscar OS');
    },
    complete: function () {
      app.dialog.close();
    }
  });
};

$$(document).on('page:init', '.page[data-name="OS"]', function () {
    retornaOs();
});

// essa pagina recebe as datas
<div class="page" data-name="agenda">
  <div class="navbar">
    <div class="navbar-inner sliding">
      <div class="left">
        <a href="/" class="link back">
          <i class="icon icon-back"></i>
          <span class="ios-only">Voltar</span>
        </a>
      </div>
      <div class="title">agenda</div>
    </div>
  </div>
  <div class="page-content">
    <div class="list">
      <form class="list" method="POST" id="list_os">
        <ul>
          <div class="block-title"><b>Periodo de Busca</b></div>
          <div class="list no-hairlines-md">
            <li>
              <div class="item-content item-input">
                <div class="item-inner">
                  <div class="item-title item-label">De</div>
                  <div class="item-input-wrap">
                    <input type="Date"  id="data-inicio" name="data-inicio" >
                  </div>
                </div>
              </div>
            </li>
            <li>
              <div class="item-content item-input">
                <div class="item-inner">
                  <div class="item-title item-label">Até</div>
                  <div class="item-input-wrap">
                    <input type="Date" id="data-fim" name="data-fim" >
                  </div>
                </div>
              </div>
            </li>
            <a href="/lista_os/">
              <div class="block">
                <p class="row">
                  <button  type="submit" id="bnt-pesquisa" class="col button button-fill color-green">Pesquisar</button>
                </p>
              </div>
            </a>
          </div>
          
          <!--Inline With Custom Toolbar!-->
          <div class="block block-strong no-padding">
            <div id="demo-calendar-inline-container"></div>
          </div>
        </ul>
      </form>
    </div>
  </div>
</div>



//esta pagina recebe o resultado da funçao
<div class="page" type="submit" data-name="OS">
  <div class="navbar">
    <div class="navbar-inner sliding">
      <div class="left">
        <a href="/" class="link back">
          <i class="icon icon-back"></i>
          <span class="ios-only">Voltar</span>
        </a>
      </div>
      <div class="logotopo sliding"> <b>Ordem concluida</b></div>
    </div>
  </div>
  <div class="page-content">
    <div class="block-title">Lista de os</div>
    <div class="list">
      <!-- Searchbar backdrop -->
      <div class="searchbar-backdrop"></div>
      <form  >
        <ul id="lista-os"></ul>
      </form>
    </div>
  </div>
</div>


<?php
include_once("conectar.php");
$dataInicio = $_POST['data-inicio'];
$dataFim = $_POST['data-fim'];
if (!$conexao) {
die("Connection failed: " . $conexao->conexao_error());
}
$sql = "SELECT nome FROM dados_os where data between  '$dataInicio' and  '$dataFim'";
if (mysqli_query($conexao, $sql)) {
$result = mysqli_query($conexao, $sql);

if ($result) {
	while ($row = $result->fetch_object()) {
		foreach ($row as $key => $col) {
			$array_linha[$key] = utf8_encode($col);
		}
		$array_resultado[] = $array_linha;
	}
	echo utf8_encode(json_encode($array_resultado));
}
mysqli_close($conexao);
} else {

echo "Error: " . $sql . "<br>" . $conexao->conexao_error;
}


?>

Answer 1

Renan, good morning.

Looking at your ajax, I noticed that your ajax does not send the "date" to your file "query.php", which is receiving the parameters via $_POST.

Missing line:

data: { dataInicio: $('#data-inicio').val(), dataFim: $('#data-fim').val()}

Thus remaining:

<script>
    function retornaOs() {

        $.ajax({
        type: "POST",
        crossDomain: true,
        data: { dataInicio: $('#data-inicio').val(), dataFim: $('#data-fim').val()}
        url: '/consulta.php',
        dataType: "JSON",
        async: false,
        beforeSend: function (xhr) {
            app.dialog.preloader('Buscando os');
        },
        success: function (result) {
            console.log(result);
        }
        };
</script>

Code on Github for future reference