Quantcast
Channel: Active questions tagged html - Stack Overflow
Viewing all articles
Browse latest Browse all 67411

Datepicker modal popup not working properly - jQuery

$
0
0

Jquery datepicker modal popup not working properly!!

If i select current date from Greaterthan date, i want to show popup like "This is future date" and if i select less than current date, i want to show popup like "This is past date" and even i select current date, same i want to show popup line "This is Todays date"

Example: if i click < current date (Show popup This is past date), > current date (Show popup This is future date), equal to Current date (Show popup This is Todays date).

Im using this function but its not working properly..

i hope my question is understandable..

Here is my fiddle..

FIDDLE HERE..

Here is my snippet..

$(document).ready(function(e) {
  $("#datepicker").datepicker().on("change", function(e) {
    var today = new Date();
    var date = (today.getMonth() + 1) + "/" + (today.getDate()) + "/" + (today.getFullYear());
    $('#myModal').modal('show');
    if ($(this).val() == date) {
      $(".modal-body p").html("You have selected today");
    } else if ($(this).val() < date) {
      $(".modal-body p").html("You have selected past date");
    } else {
      $(".modal-body p").html("You have selected future date");
    }
  });
});
<!Doctype><html><head><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"><script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.css" integrity="sha256-n3ci71vDbbK59GUg1tuo+c3KO7+pnBOzt7BDmOe87s4=" crossorigin="anonymous" /><script src="https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.js" integrity="sha256-KgOC04qt96w+EFba7KuNt9sT+ahJua25I0I2rrkZHFo=" crossorigin="anonymous"></script></head><body><div class="container"><input type="text" id="datepicker"><div id="myModal" class="modal fade" role="dialog"><div class="modal-dialog"><!-- Modal content--><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal">&times;</button><h4 class="modal-title">Modal Header</h4></div><div class="modal-body"><p>Some text in the modal.</p></div><div class="modal-footer"><button type="button" class="btn btn-default" data-dismiss="modal">Close</button></div></div></div></div></div></body></html>

Thank you..


Viewing all articles
Browse latest Browse all 67411

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>