Geek asks and answers

How to use ajax post when date change datepicker?

Good afternoon.

Value in input change using datepicker ui.

I want to use ajax post when input value is changed.

For this, I use a script:

<input type="text" name="date" class="datepicker" id="datepicker">

$(".datepicker").datepicker({changeYear: true});

$(".datepicker").on("change",function(){
var date=$(this).val();
$.post("test.php", {
date:date
},
function(data){$('#testdiv').html('');$('#testdiv').html(data);
});
});

But the post ajax post request is executed with the old date.

Datepicker doesn't matter the change in input time.

Tell me how to execute the request after datepicker change the date in the field?

I need:

1) datepicker will change the date;

2) The request must be sent with a new date.

+5
source share
4 answers

You can activate ajax post in datepicker events:

$("#datepicker").datepicker({

    onSelect: function(date, instance) {

        $.ajax
        ({
              type: "Post",
              url: "www.example.com",
              data: "date="+date,
              success: function(result)
              {
                  //do something
              }
         });  
     }
});

Hope this helps @Codebrain

+10
source

, onSelect datepicker (. ).

, ( ) .

+2

Instead on(change, you have a onSelectdatepicker that will fire when the date changes.

$(function(){
    $('.datepicker').datepicker({
        onSelect:function(dateText,instance){
            alert(dateText); //Latest selected date will give the alert.
            $.post("test.php", {
            date:dateText // now you will get the selected date to `date` in your post
            },
            function(data){$('#testdiv').html('');$('#testdiv').html(data);
            });
        }
    });
});

Hope this helps.

+1
source

you can use changeDate

$('.datepicker').datepicker()
 .on('changeDate', function(e) {
    // `e` here contains the extra attributes
});

you can check here: http://bootstrap-datepicker.readthedocs.io/en/latest/events.html

0
source

More articles:


All Articles