prevent keyboard from popping up on datepicker mobile

Question

I have this page with a booking widget and date picker here:

(Book your stay)

The following code is set to try and prevent the keyboard from coming up on mobile devices when choosing the datepicker.

<script type="text/javascript">
jQuery(function() {
 jQuery( ".hasDatepicker" ).hasDatepicker({ 
 }).attr('readonly','readonly');
});
</script>

This is working on desktop but not mobile devices. Does someone know how to prevent the keyboard from popping up on mobile?

score 0 · Answer 1 · answered Aug 08 '18 at 19:05

0

Try this (taken from ipad web application: How do I prevent the keyboard from popping up on jquery datepicker):

$(".datePicker").datepicker({
    showOn: 'button',
    onClose: function(dateText, inst) 
    { 
        $(this).attr("disabled", false);
    },
    beforeShow: function(input, inst) 
    {
        $(this).attr("disabled", true);
    }
});

answered Aug 08 '18 at 19:05

Adam

1,011
1
12
24

I tried this and it did not work. That code is also currently running now. @user3559787 – junger Aug 08 '18 at 19:10

score 0 · Answer 2 · answered Oct 19 '21 at 12:15

For others looking for this answer, this is answered here: prevent iphone default keyboard when focusing an <input>

Either of these worked for me - edit the HTML tag as follows, rather than adding JS or jQuery:

<input ... readonly="readonly">
<input ... inputmode='none'>

prevent keyboard from popping up on datepicker mobile

2 Answers2