0

Im using datepicker, but i would like to have a format 'DD/MM/YY'so I have this code:

$( ".datepicker" ).datepicker({
  dateFormat: 'dd/mm/y',
  changeMonth: true,
  changeYear: true
});

But its not working, the format is appearing "MM/DD/YY". Also when a date is selected with datepicker the datepicker is not closed, do you know how to do that?

https://jsfiddle.net/g6ko3uqn/12/

HTML:

<form method="post" class="clearfix" action="" enctype="multipart/form-data">
  <div class="form-row">
    <div class="form-group col-md-6">
      <label for="date" class="text-heading h6 font-weight-semi-bold">Date</label>
      <div class="input-group date" data-provide="datepicker">
        <input type='text' name="date" class="form-control datepicker" placeholder="DD/MM/YYY" id="datetimepicker1" placeholder="DD/MM/YYY" />
        <span class="input-group-addon">
          <i class="fa fa-calendar text-primary" aria-hidden="true"></i>
        </span>
      </div>
    </div>

  </div>

</form>
  • 1
    Did you try this https://stackoverflow.com/questions/21151830/bootstrap-datepicker-hide-after-selection – Carol Skelly Feb 16 '18 at 12:24
  • 1
    Have you tried "dd/mm/yy"? I think the format your trying to pass is invalid therefore the plugin resets to default format("mm/dd/yy") – F.Almeida Feb 16 '18 at 12:32

1 Answers1

1

Use the parent div so use .input-group.date instead of .datepicker

Then add some jquery for closing effect like this:

$('.input-group.date').on('changeDate', function(){
    $(this).datepicker('hide');
});

And you should use format not dateFormat also you missed one 'y':

format: 'dd/mm/yy',

So this should be your code:

$( ".input-group.date" ).datepicker({
  format: 'dd/mm/yy',
  changeMonth: true,
  changeYear: true
});
C.Schubert
  • 2,034
  • 16
  • 20
  • Thanks, do you know also why the format is not working? –  Feb 16 '18 at 12:32
  • Thans, but the format part is not working as you can check:https://jsfiddle.net/g6ko3uqn/51/. –  Feb 16 '18 at 12:42