3

Tengo el siguiente input de tipo date:

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
    </head>
    <body>
        <input type="date" class="form-control" name="fecha" id="fecha" value="2019-02-01">
    </body>
    </html>

Mi duda es saber si existe alguna manera de poder bloquear el día de manera tal que el usuario no pueda modificarla. Algo así como un disabled.

4
  • Hola, no entiendo bien la pregunta, ¿lo que quieres es que solo pueda modificar el mes y el año en el input? ¿podrías agregar mas información? el 9 sep. 2019 a las 17:43
  • 1
    Si lo que buscas es que solo se vea el mes y el año en el input puedes revisar Mostrar solo mes y año en un input de tipo fecha el 9 sep. 2019 a las 17:46
  • Hola @the-breaker, si, pero solo deshabilitar el dia, que el usuario no pueda modificarlo
    – Hugo
    el 9 sep. 2019 a las 17:55
  • 1
    @Hugo Con un input común y corriente no puedes. Debes usar algún plugin javascript
    – devconcept
    el 9 sep. 2019 a las 17:59

2 respuestas 2

1

Una forma posible puede ser emularlo con 2 inputs, uno deshabilitado con el día fijo y el otro puede ser input de tipo month, luego se agrega código css para dar estilo a los inputs y que luzcan como uno solo:

#dia {
font-family: Consolas, monaco, monospace; font-size: 14px;
background-color:white;
border-style: groove none groove groove;
width:43px
}
#fecha {
border-style: groove groove groove none;
}
<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
    </head>
    <body>
        <input id="dia" value="01 de  " disabled><input type="month" class="form-control" name="fecha" id="fecha" value="2019-02-01" onchange="console.log(this.value+'-01')" >
    </body>
    </html>

Se debe tomar el cuenta que debe agregarse el valor del día al obtener el valor del input ya que debería estar deshabilitado, también que el input type month aun no es compatible con Firefox, IE y Safari.

Espero haber aportado a resolver el problema, saludos.

Referencias:

Emulando Campo con un poco de CSS

Mostrar solo mes y año en un input de tipo fecha

input type="month"

0

Te sugiero utilizar DateTime Picker, puedes deshabilitar días de la semana en especifico, entre otras cosas:

daysOfWeekDisabled: "1,2,3,4,5",

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.