deactivate Sundays in the input date html?

Question

deactivate Sundays in the input date html?

Navigation

#1 by (1 votes)
#2 by (0 votes)

3

I need to deactivate the Sundays of the input date, that is, the user can not choose Sundays, it would be better for me to block those days, that is, I do not want you to tell me you chose an invalid day, but it does not show the Sunday similar to this image that takes it from the internet

But there I'm off the weekend I just want Sunday thanks

the code that I have is only from the input, I do not use nigun plugin

 <label>Feche inicio</label>
 <input id="infechaini" 
     type="date" name="infechaini" 
     onblur="obtenerfechafinf1();" style="height:30px;">

javascript jquery html

asked by ingswsm 06.07.2017 в 20:00

source

2 answers

How can I code a MySQL query to UTF-8? Jasper Report, reports with subreport in java

score 1 · Answer 1

Proof of concept using a hidden false SUBMIT to trigger the validation of FORM that includes INPUT to test if it is Sunday.

vanilla Javascript. personalized message adapt to your needs. foot references

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>

References:

** link

Compatibility tables for <INPUT type="date"> :

link

Examples of UI in the different browsers that support it:

link

Note: edge shows the UI in a way that it is not possible to know what day of the week it is.

Can I use link (can I use it?)

link

score 0 · Answer 2

0

You can use the following script. You need to use jquery and jquery-ui

$("#infechaini").datepicker({
beforeShowDay: function(date) {
    var day = date.getDay();
    return [(day != 0), ''];
} });

answered by 06.07.2017 в 20:37