3

necesito desactivar los domingos del input date , es decir que el usuario no pueda elegir los domingos,lo mejor seria que me bloquee esos dias,es decir no quiero que me diga usted eligio un dia invalido , si no que no aparesca el domingo parecido a esta imagen que lo saque de internet introducir la descripción de la imagen aquí

pero ahi me desactiva los fin de semana yo solo quiero el domingo gracias

el codigo que tengo es solo del input, no uso nigun plugin

 <label>Feche inicio</label>
 <input id="infechaini" 
     type="date" name="infechaini" 
     onblur="obtenerfechafinf1();" style="height:30px;"> 
2
  • 2
    Utilizas algún plugin? si es así que plugin utilizas? y coloca tu código en la pregunta de como tienes configurado, recuerda añadir un ejemplo mínimo verificable
    – JuankGlezz
    Commented el 6 jul. 2017 a las 18:04
  • Los input nativo de los browsers no permiten deshabilitar un día por semana, si podrías deshabilitar un rango de fechas pero un solamente un día no. Tenés 2 opciones: Usar un plugin (buena opción) o validar después de elegir el día. Commented el 6 jul. 2017 a las 18:18

2 respuestas 2

1

Prueba de concepto usando un SUBMIT falso escondido para disparar la validación del FORM que engloba al INPUT a testear si es domingo.

vanilla Javascript. mensaje personalizado. adapte a sus necesidades. referencias al pie

var elDate = document.getElementById('infechaini');
var elForm = document.getElementById('elForm');
var elSubmit = document.getElementById('elSubmit');

function sinDomingos(){
    var day = new Date(elDate.value ).getUTCDay();
    // Días 0-6, 0 es Domingo 6 es Sábado
    elDate.setCustomValidity(''); // limpiarlo para evitar pisar el fecha inválida
    if( day == 0 ){
       elDate.setCustomValidity('Domingos no disponibles, por favor seleccione otro día');
    } else {
       elDate.setCustomValidity('');
    }
    if(!elForm.checkValidity()) {elSubmit.click()};
}

function obtenerfechafinf1(){
    sinDomingos();
}
<form action="#" id="elForm">
  <label>Feche inicio</label>
  <input 
   id="infechaini" 
   type="date" name="infechaini" onChange="sinDomingos();" 
   onblur="obtenerfechafinf1();" style="height:30px;" required="required"/>
   <input
    id="elSubmit" type="submit" style="display:none;" />
</form>

Referencias:

** https://tiffanybbrown.com/2013/10/24/date-input-in-html5-restricting-dates-and-thought-for-working-around-limitations/

** https://stackoverflow.com/q/26096847/1423096

Tablas de compatibilidad del <INPUT type="date"> :

https://developer.mozilla.org/es/docs/Web/HTML/Elemento/input/date#Compatibilidad_entre_navegadores

Ejemplos de UI en los distintos navegadores que lo soportan:

https://developer.mozilla.org/es/docs/Web/HTML/Elemento/input/date

Nota: edge muestra el UI de una forma que no es posible saber que día de la semana es.

Can I use link (puedo usarlo?)

https://caniuse.com/#search=input%20date

2
  • Hola, la respuesta funciona bien en Chrome, pero no funciona en Mozilla y tal vez tampoco en otros navegadores, es algo a tomar en cuenta, saludos. Commented el 10 may. 2018 a las 0:09
  • editado, links para saber que navegadores soportan el control Commented el 10 may. 2018 a las 0:37
0

puedes usar el siguiente script. Necesitas usar jquery y jquery-ui

$("#infechaini").datepicker({
beforeShowDay: function(date) {
    var day = date.getDay();
    return [(day != 0), ''];
} });
1
  • El OP no hace uso de alguna librería o plugin, y por lo que veo no solicita el uso de alguna. Considera eliminar esta respuesta ya que no responde a la pregunta, solo es una sugerencia para usar alguna libreria
    – JuankGlezz
    Commented el 6 jul. 2017 a las 20:55

Tu Respuesta

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

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