Ajax提交一页PHP

Question

I have code with single page PHP method

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>

<?php
if(isset($_POST['submit'])){
   $date=$_POST['date'];
}else{
   $date=date('Y-m-d');
}
?>
<form action="" method="post" id="formId">
   <input type="text" name="date" id="datepicker">
   <input type="submit" name="submit">
</form>
<?php echo $date; ?>

<script>
$(function() {
   $('#datepicker').datepicker({
         autoclose: true
    })
 });
</script>

how, if i want to use ajax to keep the page not to reload? please help me

Answer 1

ok so here is quick tutorial. ajax helps you to submit your form without page loading. You have to use action="somepage.php". when you click it it will pass the values there right away. so here is basic coding

<form id="formId">
   <input type="text" name="dte" id="dte">
   <button type="button" id="buttonsubmit">submit</button>
</form>

and ajax should be look like. In my coding id="buttonsubmit" is button id so when user will click it it run the function and takes the values

var dte;
    $("#buttonsubmit").click(function(){
    dte = $("#dte").val();
    $.ajax({
    url:"somepage.php",
    method:"POST",
    data:{dte: dte},
    success: function (data){
    if(data == "done"){
     window.location='http://somedomain.com/';
    }
    }
    });
    });

in somepage.php you will have

<?php
if(isset($_POST['dte'])){
   $date=$_POST['dte'];
   echo "done";
}else{
   $date=date('Y-m-d');
}
?>

note: i am writing echo "done"; in success method it will come and according to code when success will see it will redirect the page