How to get the value of date picker on change in jquery

Question

I need to get the value of date onchange ,

Here is the code

<div class="input-daterange" data-date-format="dd/mm/yyyy">

       <label>Date </label>                                                       
<input id="value_date"  class="form-control"  name="start" type="text" />                                                                              
</div>

Here is my jquery

$('#value_date').change(function() {{

    var valuefirstone = document.getElementById('#value_date').value;
    alert(valuefirstone);
}
</script>

Onchange the function is not calling, I have just create alert on change but its not working

Answer 1

try this ;

$('#value_date').datepicker().on('changeDate', function (ev) {
    var valuefirstone = $(this).val();
    alert(valuefirstone);
});

Remove the .datepicker() if it's done earlier

Answer 2

it is better to use jquery built in functions inside a jquery context . Also your jquery change function syntax and javascript code to get the value from date picker is wrong.

change your jquery change function to:

$(document).ready(function(){

    $('#value_date').change(function() {

        var valuefirstone = $(this).val();//use jquery built in functions
        alert(valuefirstone);

    });

});

Make sure you wrapped the change function with document ready fn

Answer 3

you can easily do with below code:

 $("#value_date").on('change', function(event) {
   event.preventDefault();
   alert(this.value);
  /* Act on the event */
  });

Answer 4

$('#value_date').change(function() {{

    alert($('#value_date').val());
}
</script>

Notice the two changes - remove get by id and changed to .val().