Could not fire event when default date selected using Jquery datepicker

General Tech Bugs & Fixes 2 years ago

0 2 0 0 0 tuteeHUB earn credit +10 pts

5 Star Rating 1 Rating

Posted on 16 Aug 2022, this text provides information on Bugs & Fixes related to General Tech. Please note that while accuracy is prioritized, the data presented might not be entirely correct or up-to-date. This information is offered for general knowledge and informational purposes only, and should not be considered as a substitute for professional advice.

Take Quiz To Earn Credits!

Turn Your Knowledge into Earnings.

tuteehub_quiz

Answers (2)

Post Answer
profilepic.png
manpreet Tuteehub forum best answer Best Answer 2 years ago

 

I need to fire event while default date is selected at the time of page load using Jquery datepicker. I am explaining my code below.

 name="date" type="text" id="alltour" class="datepickerdate" placeholder="" value="" >

$('#alltour').datepicker({
       dateFormat: 'dd-mm-yy',
       minDate: 0,
       beforeShowDay: enableAllTheseDays,
       onSelect: function(dateText, inst) {
            $('#alltour').val(dateText);
            console.log('selected date',$('#alltour').val());
       }
}).datepicker("setDate", new Date());

Here when page is loading the default date is selected and when this default date will populate in the field a event should be fired. As per my code its now working for first time default date selected.

profilepic.png
manpreet 2 years ago

Try binding changeDate event

$(document).ready(function() {
  $('#alltour').datepicker({
    dateFormat: 'dd-mm-yy',
    minDate: 0,
  }).on('changeDate', function(dateText, inst) {
    console.log('selected date', $('#alltour').val());
  }).datepicker("setDate", new Date());
});

href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"> src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"> href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker.css" rel="stylesheet" /> src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"> name="date" type="text" id="alltour" class="datepickerdate" placeholder="" value="">

0 views   0 shares

No matter what stage you're at in your education or career, TuteeHub will help you reach the next level that you're aiming for. Simply,Choose a subject/topic and get started in self-paced practice sessions to improve your knowledge and scores.