JQuery Datepicker - Send selected date to a new page, using it as a php variable

Question

EDIT

I got it working puting the date behind the url to the target site. On the other side I'm using $_GET['val'] to get the value. But this way too hacky and I'd love to see an more secure solution. But for now it works.

---

What I'm trying to achieve

Page 1: Showing a datepicker. The user clicks on a date and gets directed to "Page 2".

Page 2: Showing the previously selected date.

Whats the problem? How do I send the selected date to a new page (so I can store the date in a php variable). Also I want to direct the user to the new page automatically after selecting a date.

---

This is what I got so far:

index.php (containing the datepicker)

$( function() {
    $( "#datepicker" ).datepicker({
        onSelect: function(dateText, inst) {                    
            var date = $('#datepicker').val();  
            alert(date);
            $.post('getdate.php', {'val': dateText});
        }
    });
}); 

getdate.php

<?php
  $value = $_POST['val'];
  echo "I got your value! $val";
?>

The alert shows the selected date, so the variable is containing the date. But I can't get it so send it to my next page.

Thanks for helping!

Answer 1

you are posting dateText...try posting date like:

$.post('getdate.php', {'val': date});

Answer 2

You have a lot of options to make it work. Here are three of them:

1) Send the selected date to page 2 as a query parameter:

$( function() {
    $( "#datepicker" ).datepicker({
        onSelect: function(dateText, inst) {                    
            var date = $('#datepicker').val();  
            window.location.href = 'page2.php?date=' + date;
        }
    });
}); 

2) Put your datepicker insider a form and submit it after date selection.

3) Store the date in session inside your getdate.php file:

if (!empty($_POST['val'])) {
    session_start();
    $_SESSION['current_date'] = $_POST['val'];
}

... and check inside your second page:

//page2.php
session_start();
if (!isset($_SESSION['current_date'])) {
    header('Location:index.php'); //redirect to first page if date not set
}

$selectedDate = $_SESSION['current_date'];
....

Choose the one that fits better your problem.

Answer 3

Your script is sending the date to the script getdate.php. But you do not see it i the browser because your ajax post does not send the user to the page. For this you would need to direct the script to that page, and one approach would be using a form:

index.php should also have a form:

<form id="hiddenfrm" action="getdate.php" method="post">
    <input type="hidden" name="val" id="val" />
</forms>


<script>
$( function() {
    $( "#datepicker" ).datepicker({
        onSelect: function(dateText, inst) {                    
            var date = $('#datepicker').val();  
            $('#val').val(date);
            $('hiddenfrm').submit();
        }
    });
}); 
</script>

Answer 4

It may also be as simple as the val parameter is in quotes and I don't think it should be.

$.post('getdate.php', {val: date});