John Davidson

Message:

I made my table autoload using ajax once a user enters data in the to_date date box but it seems like I can't retrieve the data to another PHP file using this script. I'm still a beginner in coding so please be easy on me.
Please help. Thanks!

<script type="text/javascript">

    $(document).ready(function(){

        // load_data(); 



        function load_data(fromdate, todate)

        {

            $.ajax({

                url:"vehicle_table.php",

                method:"POST",

                data:{fromdate:fromdate, todate:todate},

                success:function(data) {

                    $('.activity').html(data);

                }

            });

        }

  

        let to_date = document.querySelector("#to_date");

        let from_date = document.querySelector("#from_date");

        to_date.addEventListener("change", stateHandle);

        from_date.addEventListener("change", stateHandle);

        to_date.disabled = true;

        var fromdate = $('#from_date').datepicker({  format: 'yyyy-mm-dd'});

        var todate = $('#to_date').datepicker({  format: 'yyyy-mm-dd'});



        function stateHandle() {

            if(document.querySelector("#from_date").value === "") {

                to_date.disabled = true;

                $('.activity').html('');          

            } else {     

                if(document.querySelector("#to_date").value === ""){

                    to_date.disabled = false;

                    $('.activity').html('');

                } else {          

                    to_date.disabled = false;

                    $.ajax({

                        url:"vehicle_table.php",

                        method:"POST",

                        data:{fromdate:fromdate, todate:todate},

                        success:function(data) {

                            $('.activity').html(data);

                        }

                    });



            }     

            to_date.disabled = false;

            $('.activity').html('');

        } 

    } 

    $(document).ready(function(){  

        $.datepicker.setDefaults({  

            dateFormat: 'yy-mm-dd'   

        });  

    });

});

</script>

These are my from_date and to_date.

<form action="vehicle_table.php" method="post">

    <div class="col-md-4">

      <label for="from_date"></label>

      <input type="date" name="from_date" id="from_date" class="form-control datepicker input" placeholder="From Date" />

    </div>

    <div class="col-md-4">

      <label for="to_date"></label>

      <input type="date" name="to_date" id="to_date" class="form-control datepicker input2" placeholder="To Date" />

    </div>                                         

    </div>

  </form>

I didn't see any error but it didn't get pass through the

if(isset($_POST['fromdate'],$_POST['todate']))

---

My Answer:
It looks like the issue might be with how you are passing the `fromdate` and `todate` variables in your AJAX request. In your script, you are passing the variables as `fromdate:fromdate` and `todate:todate`, but in your PHP file, you are trying to access them as `$_POST['fromdate']` and `$_POST['todate']`.

You should update your AJAX request to pass the values of the date inputs instead of the jQuery datepicker objects. You can do this by getting the values of the date inputs in your `stateHandle` function and then passing those values in the AJAX request.

Here is an updated version of your script:

javascript
$(document).ready(function(){
function load_data(fromdate, todate) {
$.ajax({
url: "vehicle_table.php",
method: "POST",
data: {fromdate: fromdate, todate: todate},
success: function(data) {
$('.activity').html(data);
}
});
}

let to_date = document.querySelector("#to_date");
let from_date = document.querySelector("#from_date");
to_date.addEventListener("change", stateHandle);
from_date.addEventListener("change", stateHandle);
to_date.disabled = true;

function stateHandle() {
let fromdate = $('#from_date').val();
let todate = $('#to_date').val();

if(fromdate === "") {
to_date.disabled = true;
$('.activity').html('');
} else {
if(todate === ""){
to_date.disabled = false;
$('.activity').html('');
} else {
to_date.disabled = false;
load_data(fromdate, todate);
}
}
}

$(document).ready(function(){
$.datepicker.setDefaults({
dateFormat: 'yy-mm-dd'
});
});
});


With this change, the `fromdate` and `todate` variables will now contain the values of the date inputs, which should allow you to retrieve them in your PHP file using `$_POST['fromdate']` and `$_POST['todate']`.