CODEWITHSUNDEEP
javascriptdatebootstrap-datepicker
Javier
Javier

Reputation: 2169

Bootstrap datepicker not validating format during manual input

I'm using bootstrap-datepicker.js (version 1.6.1) to display a simple datepicker with dd/mm/yyyy format.

It is initialized like this:

 $e.datepicker({
      format: "dd/mm/yyyy"
     , endDate: ed // end date
     , autoclose: true
     , startDate: sd // start date
     , language: lang
 });

The datepicker works just fine and date are set correctly to the configurated format if the user navigates through the calendar and clicks the desired date.

But the problem comes when he types the date manually on the input.

Somehow if the user manually types DD/MM/YY this value is being accepted by the datepicker and is not automatically converted to DD/MM/YYYY.

Does anyone knows if this is a limitation of the datepicker library or am I missing some configuration here?.

Upvotes: 1

Views: 1140

Answers (1)

ThinhLe
ThinhLe

Reputation: 409

I think you can use 

onkeydown="return false"

to avoid manual input. If not, you must write JS to format date. Datepicker automatically converted from manual input. 

$('#txtDob').datepicker({
  format: 'dd/mm/yyyy',
  autoclose: true  
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker3.css" rel="stylesheet" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/locales/bootstrap-datepicker.de.min.js"></script>

<form action="#" method="post">
  <label for="txtDob"></label>
  <input onkeydown="return false" type="text" id="txtDob" />
</form>

Upvotes: 0

Related Questions