Return the date value selected in the datapicker in a variable

Asked

Viewed 25 times

-2

Good afternoon community, first question here. I have a datepicker fixed on a div in my code, not an input!! and I’m not able to take the selected value and store a variable because I need to later use it in a query in the database.

var currentDate = $( ". selector" ).datepicker( "getDate" );

This is the code that is in the documentation, but when I apply it in my code it does not return in the variable.

<!DOCTYPE html>
<html>
<head>
<title>Lava - Jato</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" />
    <link rel="stylesheet" type="text/css" href="estilo.css">
  </head>
  <body>
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    
    <script>
    $(document).ready(function() {
    $(".datepicker").datepicker({
        dateFormat: 'dd/mm/yy',
        dayNames: ['Domingo','Segunda','Terça','Quarta','Quinta','Sexta','Sábado','Domingo'],
        dayNamesMin: ['D','S','T','Q','Q','S','S','D'],
        dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb','Dom'],
        monthNames: ['Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'],
        monthNamesShort: ['Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set','Out','Nov','Dez'],
        maxDate: "+1w",
        minDate: 0,
        weekHeader: "W",
        onSelect: function (dateText) {
        var currentDate = $( ".datepicker" ).datepicker( "getDate" );
        }
    });
    });

</script>
<div id="cards">
      <div class="datepicker"></div>
            <h1> Data do Agendamento:<?php echo $currentDate;?></h1>
</div>

I am doing something wrong in my code ? because it returns the following message in my pag. Warning: Undefined variable $currentDate in C: xampp htdocs Project Pages conc-scheduling conc-scheduling.php on line 77

  • onSelect: function (dateText) the selected date comes in the "dateText variable"

  • Good afternoon Ricardo, continue with the mistake. Warning: Undefined variable $dateText in C: xampp htdocs Project Pages conc-scheduling conc-scheduling.php on line 77

  • this variable only applies within the function associated with onSelect

  • Is PHP 7 or 7+ right? This error is because the variable is empty. It would have to be: <?php if (isset($dateText)) { echo $dateText;};?> To update the date each time someone 'pica' a new date will need to use javascript

1 answer

0

Your code is working, the problem is when you load Document (document.ready) there is no date selected, and then the error you are seeing is PHP because the variable is empty. It has to be

 <?php
      if (isset($dateText)) 
      { 
          echo $dateText;
      }
;?>

What I did was add a line of JS that updates the <span> with the date selected.

$(document).ready(function() {
    $(".datepicker").datepicker({
        dateFormat: 'dd/mm/yy',
        dayNames: ['Domingo','Segunda','Terça','Quarta','Quinta','Sexta','Sábado','Domingo'],
        dayNamesMin: ['D','S','T','Q','Q','S','S','D'],
        dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb','Dom'],
        monthNames: ['Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'],
        monthNamesShort: ['Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set','Out','Nov','Dez'],
        maxDate: "+1w",
        minDate: 0,
        weekHeader: "W",
        onSelect: function (dateText) {
        var currentDate = $( ".datepicker" ).datepicker( "getDate" );
        $('#cards span').text(currentDate);
        }
    });
    });
<!DOCTYPE html>
<html>
<head>
<title>Lava - Jato</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" />
    <link rel="stylesheet" type="text/css" href="estilo.css">
  </head>
  <body>
      <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div id="cards">
      <div class="datepicker"></div>
            <h1> Data do Agendamento: <span></span></h1>
</div>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.