How to prevent opening datepicker after choosing a date?

Question

Datepicker keeps on opening after selecting a date, how to prevent opening datepicker after choosing the date?

$("#dateload").datepicker({
    dateFormat: 'mm-dd-yy'
});

I tried with autoclose property to true but did not worked. I also tried with on change event to hide the datepicker, also not worked.

It means the user can't correct his input. What is the reason you want to do that? Why don't you implement a button, where the user can confirm the chosen date is right. By firing this button you could run a function that disables the datepicker. In my opinion this would have better user experience. — cezar, Apr 20 '17 at 13:35
check this [link](http://stackoverflow.com/questions/7812063/jquery-datepicker-readonly) — Ryad Boubaker, Apr 20 '17 at 13:36

Theodore K. · Answer 1 · 2017-04-20T13:38:37.323

0

I would go with this. (Demo here: http://codepen.io/8odoros/pen/OmNMVy)

 $( "#dateload" ).datepicker({
    dateFormat: 'mm-dd-yy',
    onSelect:function(){      
        if($(this).datepicker("getDate")) $(this).datepicker("destroy");
    }
  });

edited Apr 20 '17 at 13:38

answered Apr 20 '17 at 13:33

Theodore K.

5,058
4
30
46

This will destroy the datepicker, if you want to change date it will not work.You can choose date only for first time. – Mihai Alexandru-Ionut Apr 20 '17 at 13:51
I think he want to close datepicker when he choose the date but can choose another date then. – Mihai Alexandru-Ionut Apr 20 '17 at 13:52
Yes, As @Alexandru-IonutMihai said, I am not able to change date and its working for only first time. – Earth Apr 21 '17 at 10:08
@User1674987, have a look to my answer. – Mihai Alexandru-Ionut Apr 21 '17 at 10:09
@Alexandru-IonutMihai, Any Ideas ? – Earth Apr 21 '17 at 10:32
@User1674987, create a demo, showing that strange case. Otherwise we can only quess what the the problem is and any sollution given would propably be useless to you... – Theodore K. Apr 24 '17 at 08:16

score 0 · Answer 2 · answered Apr 20 '17 at 13:33

0

Try to use this on change event handler.

$('#dateload').datepicker({
  format: 'mm-dd-yy'
}).on('change', function(){
    $('#dateload ~ .ui-datepicker').hide();
});

answered Apr 20 '17 at 13:33

Mihai Alexandru-Ionut

47,092
13
101
128

I tried it but not working. Its getting hidden and shown again. – Earth Apr 21 '17 at 10:19
@User1674987, have you tried `autoClose:true` property ? – Mihai Alexandru-Ionut Apr 21 '17 at 17:41

Islam Zedan · Answer 3 · 2017-04-20T13:56:31.297

0

You can try to hide the dates after date changes like this

 $('#dateload').datepicker({
      format: 'mm-dd-yy'
    }).on('change', function(){
        $('.datepicker').hide();
    });

edited Apr 20 '17 at 13:56

answered Apr 20 '17 at 13:34

Islam Zedan

656
4
21

How to prevent opening datepicker after choosing a date?

3 Answers3