Cómo no mostrar un teclado móvil cuando se utiliza bootstrap-datepicker?

Si usted está usando Bootstrap3 Datepicker:
https://eonasdan.github.io/bootstrap-datetimepicker

Sólo tiene que añadir esta propiedad a la entrada: readonly=»readonly»
y esta propiedad
opciones a la hora de crear instancias de la biblioteca.

$('#datetimepicker1').datetimepicker({
        useCurrent: false,
        daysOfWeekDisabled: [0, 6],
        format: 'DD-MM-YYYY',
        ignoreReadonly: true   <------ this property
});

Probado en Safari en el iPhone y el de Chrome /navegador Nativo de Android.

Esta es la forma en que he logrado esto, pero me gustaría saber si hay mejores maneras.

Con las mismas opciones en la pregunta, entonces, también hace que el cuadro de texto HTML readonly haciendo esto en mi HTML:

@Html.EditorFor(model => model.Date, new { htmlAttributes = new { 
    @class = "form-control datepicker", @readonly = "true",
}})

Esto parece funcionar como JavaScript puede cambiar el valor del campo. Sin embargo, ello hace que el fondo del cuadro de texto de color gris (es decir, personas con discapacidad) y cambia el puntero del ratón en el icono del icono de círculo ( not-allowed ), que no es deseado. Para evitar que la hice esto agrega un estilo en línea:

@Html.EditorFor(model => model.Date, new { htmlAttributes = new { 
    @class = "form-control datepicker", @readonly = "true",
    style = "cursor: default; background-color: #fff"
}})

He intentado reemplazar la cursor y background-color en CSS (utilizando !important), pero que no parecen funcionar en Internet Explorer.

Esto no es bonita, pero a mí me funciona. Todavía necesitan ver cómo se podría hacer esto de un modo más sólido (por ejemplo, no codificar el color de fondo, no tener que especificar esto en todos mis campos de fecha, etc.). Si alguien sabe una mejor manera, me gustaría mucho aprecio.

Tengo o he tenido un problema similar como este.

Yo uso un campo de entrada type=text donde puedo enlazar jQuery datepicker a ella. Cuando seleccione el campo de entrada de mi móvil (android, chrome) me sale el selector de fecha y el teclado del teléfono.

Después de buscar en StackOverflow he encontrado algunas soluciones acerca de la configuración del campo de entrada en el modo de sólo lectura o deshabilitar el campo. El problema con esto es que cuando se deshabilita el campo no va a ser enviados, y cuando sólo lectura se establece jQuery validator salta el campo. Así que necesitaba una solución diferente.

Ahora he solucionado dejando que el datepicker de establecer el campo de sólo lectura antes de abrir el selector, y la eliminación de la readonly cuando el selector está cerrado. He probado hasta ahora en el móvil android (chrome y I. E) y yo no reciben el teclado nativo. iphone/ipad no está probado aún, pero tal vez otros puedan ver.

El código es:

$(this).datepicker({
beforeShow: function(input, obj){$(input).prop('readonly', 'readonly');},
onClose: function () {$(this).prop('readonly', false);}});

También añadir atributo readonly en el selector de fecha.

$(".datepicker").datepicker({
    format: "dd-M-yyyy",
    autoclose: true,
    disableTouchKeyboard: true,
    Readonly: true
}).attr("readonly", "readonly");

Esta es una vieja pregunta, pero yo pensé que debería compartir mi solución, ya que esta pregunta se muestra en la búsqueda de Google. Si usted hace el tipo de entrada de un botón del teclado no se muestra y puedes cambiar el estilo del botón para que parezca un campo de entrada de texto si usted realmente necesita.

<input type="button" style="background-color:white;border:1px solid #DDD;padding:5px;cursor:text;" value="Enter a Date" id="datepicker">