Skip to main content
<!DOCTYPE html>
<html>
<head>
    <title>Prueba</title>
</head>
<body>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>
    <div>
        <label for="datepicker">Selecciona Fecha:</label>
        <input type="text" id="datepicker"/>
    </div>


    <script type="text/javascript">

        var disableddates = ["8-3-2017", "12-11-2016", "8-25-2017", "8-20-2017"];

        function DisableSpecificDates(date) {

            var m = date.getMonth();
            var d = date.getDate();
            var y = date.getFullYear();
            var currentdate = (m + 1) + '-' + d + '-' + y ;

            for (var i = 0; i < disableddates.length; i++) {
                if ($.inArray(currentdate, disableddates) != -1 ) {
                    return [false];
                } 
            }

            return disableddates;
        }

        $( function() {
            $.datepicker.setDefaults($.datepicker.regional["es"]);
            $( "#datepicker" ).datepicker({
                dateFormat: 'yy-mm-dd',
                changeMonth:true,
                changeYear:true,
                yearRange: "2006:2017", 
                firstDay: 1,
                minDate: new Date(006, 12, 1), /** AAAA,MM,DD Fecha inicio */
                maxDate: new Date(2020, 11, 31), /** AAAA,MM,DD Fecha Fin */

                monthNames: ['Enero', 'Febrero', 'Marzo',
                'Abril', 'Mayo', 'Junio',
                'Julio', 'Agosto', 'Septiembre',
                'Octubre', 'Noviembre', 'Diciembre'],
                monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun',
                'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
                dayNamesMin: ['Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab'],
                beforeShowDay: DisableSpecificDates
            });
        });
    </script>
</body>
</html>

<head>
    <title>Prueba</title>
</head>
<body>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>
    <div>
        <label for="datepicker">Selecciona Fecha:</label>
        <input type="text" id="datepicker"/>
    </div>


    <script type="text/javascript">

        var disableddates = ["8-3-2017", "12-11-2016", "8-25-2017", "8-20-2017"];

        function DisableSpecificDates(date) {

            var m = date.getMonth();
            var d = date.getDate();
            var y = date.getFullYear();
            var currentdate = (m + 1) + '-' + d + '-' + y ;

            for (var i = 0; i < disableddates.length; i++) {
                if ($.inArray(currentdate, disableddates) != -1 ) {
                    return [false];
                } 
            }

            return disableddates;
        }

        $( function() {
            $.datepicker.setDefaults($.datepicker.regional["es"]);
            $( "#datepicker" ).datepicker({
                dateFormat: 'yy-mm-dd',
                changeMonth:true,
                changeYear:true,
                yearRange: "2006:2017", 
                firstDay: 1,
                minDate: new Date(006, 12, 1), /** AAAA,MM,DD Fecha inicio */
                maxDate: new Date(2020, 11, 31), /** AAAA,MM,DD Fecha Fin */

                monthNames: ['Enero', 'Febrero', 'Marzo',
                'Abril', 'Mayo', 'Junio',
                'Julio', 'Agosto', 'Septiembre',
                'Octubre', 'Noviembre', 'Diciembre'],
                monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun',
                'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
                dayNamesMin: ['Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab'],
                beforeShowDay: DisableSpecificDates
            });
        });
    </script>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
    <title>Prueba</title>
</head>
<body>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>
    <div>
        <label for="datepicker">Selecciona Fecha:</label>
        <input type="text" id="datepicker"/>
    </div>


    <script type="text/javascript">

        var disableddates = ["8-3-2017", "12-11-2016", "8-25-2017", "8-20-2017"];

        function DisableSpecificDates(date) {

            var m = date.getMonth();
            var d = date.getDate();
            var y = date.getFullYear();
            var currentdate = (m + 1) + '-' + d + '-' + y ;

            for (var i = 0; i < disableddates.length; i++) {
                if ($.inArray(currentdate, disableddates) != -1 ) {
                    return [false];
                } 
            }

            return disableddates;
        }

        $( function() {
            $.datepicker.setDefaults($.datepicker.regional["es"]);
            $( "#datepicker" ).datepicker({
                dateFormat: 'yy-mm-dd',
                changeMonth:true,
                changeYear:true,
                yearRange: "2006:2017", 
                firstDay: 1,
                minDate: new Date(006, 12, 1), /** AAAA,MM,DD Fecha inicio */
                maxDate: new Date(2020, 11, 31), /** AAAA,MM,DD Fecha Fin */

                monthNames: ['Enero', 'Febrero', 'Marzo',
                'Abril', 'Mayo', 'Junio',
                'Julio', 'Agosto', 'Septiembre',
                'Octubre', 'Noviembre', 'Diciembre'],
                monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun',
                'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
                dayNamesMin: ['Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab'],
                beforeShowDay: DisableSpecificDates
            });
        });
    </script>
</body>
</html>

<head>
    <title>Prueba</title>
</head>
<body>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>
    <div>
        <label for="datepicker">Selecciona Fecha:</label>
        <input type="text" id="datepicker"/>
    </div>


    <script type="text/javascript">

        var disableddates = ["8-3-2017", "12-11-2016", "8-25-2017", "8-20-2017"];

        function DisableSpecificDates(date) {

            var m = date.getMonth();
            var d = date.getDate();
            var y = date.getFullYear();
            var currentdate = (m + 1) + '-' + d + '-' + y ;

            for (var i = 0; i < disableddates.length; i++) {
                if ($.inArray(currentdate, disableddates) != -1 ) {
                    return [false];
                } 
            }

            return disableddates;
        }

        $( function() {
            $.datepicker.setDefaults($.datepicker.regional["es"]);
            $( "#datepicker" ).datepicker({
                dateFormat: 'yy-mm-dd',
                changeMonth:true,
                changeYear:true,
                yearRange: "2006:2017", 
                firstDay: 1,
                minDate: new Date(006, 12, 1), /** AAAA,MM,DD Fecha inicio */
                maxDate: new Date(2020, 11, 31), /** AAAA,MM,DD Fecha Fin */

                monthNames: ['Enero', 'Febrero', 'Marzo',
                'Abril', 'Mayo', 'Junio',
                'Julio', 'Agosto', 'Septiembre',
                'Octubre', 'Noviembre', 'Diciembre'],
                monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun',
                'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
                dayNamesMin: ['Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab'],
                beforeShowDay: DisableSpecificDates
            });
        });
    </script>
</body>
</html>

se añadieron 711 caracteres en el cuerpo
Origen Enlace
Alvarez
  • 4k
  • 4
  • 18
  • 39

tienes que declarar un array para almacenar todos los dias feriados alli. Asi lo logras: Lo edite para adaptarlo a lo que tu tienes:

<!DOCTYPE html>
<html>
<head>
    <title>Prueba</title>
</head>
<body>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>
    <div>
        <label for="datepicker">Selecciona Fecha:</label>
        <input type="text" id="datepicker"/>
    </div>


    <script type="text/javascript">

        var disableddates = ["8-3-2017", "12-11-2016", "8-25-2017", "8-20-2017"];

        function DisableSpecificDates(date) {

            var m = date.getMonth();
            var d = date.getDate();
            var y = date.getFullYear();
            var currentdate = (m + 1) + '-' + d + '-' + y ;

            for (var i = 0; i < disableddates.length; i++) {

 
                if ($.inArray(currentdate, disableddates) != -1 ) {
                    return [false];
                } 
            }

            return disableddates;
        }

        $( function() {
            $.datepicker.setDefaults($.datepicker.regional["es"]);
            $( "#datepicker" ).datepicker({
                dateFormat: 'yy-mm-dd',
                changeMonth:true,
                changeYear:true,
                yearRange: "2006:2017", 
                firstDay: 1,
                minDate: new Date(006, 12, 1), /** AAAA,MM,DD Fecha inicio */
                maxDate: new Date(2020, 11, 31), /** AAAA,MM,DD Fecha Fin */

                monthNames: ['Enero', 'Febrero', 'Marzo',
                'Abril', 'Mayo', 'Junio',
                'Julio', 'Agosto', 'Septiembre',
                'Octubre', 'Noviembre', 'Diciembre'],
                monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun',
                'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
                dayNamesMin: ['Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab'],
                beforeShowDay: DisableSpecificDates
            });
        });
    </script>
</body>
</html>

tienes que declarar un array para almacenar todos los dias feriados alli. Asi lo logras:

<!DOCTYPE html>
<html>
<head>
    <title>Prueba</title>
</head>
<body>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>
    <div>
        <label for="datepicker">Selecciona Fecha:</label>
        <input type="text" id="datepicker"/>
    </div>


    <script type="text/javascript">

        var disableddates = ["8-3-2017", "12-11-2016", "8-25-2017", "8-20-2017"];

        function DisableSpecificDates(date) {

            var m = date.getMonth();
            var d = date.getDate();
            var y = date.getFullYear();
            var currentdate = (m + 1) + '-' + d + '-' + y ;

            for (var i = 0; i < disableddates.length; i++) {

 
                if ($.inArray(currentdate, disableddates) != -1 ) {
                    return [false];
                } 
            }

            return disableddates;
        }

        $(function() {
            $( "#datepicker").datepicker({
                beforeShowDay: DisableSpecificDates
            });
        });
    </script>
</body>
</html>

tienes que declarar un array para almacenar todos los dias feriados alli. Asi lo logras: Lo edite para adaptarlo a lo que tu tienes:

<!DOCTYPE html>
<html>
<head>
    <title>Prueba</title>
</head>
<body>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>
    <div>
        <label for="datepicker">Selecciona Fecha:</label>
        <input type="text" id="datepicker"/>
    </div>


    <script type="text/javascript">

        var disableddates = ["8-3-2017", "12-11-2016", "8-25-2017", "8-20-2017"];

        function DisableSpecificDates(date) {

            var m = date.getMonth();
            var d = date.getDate();
            var y = date.getFullYear();
            var currentdate = (m + 1) + '-' + d + '-' + y ;

            for (var i = 0; i < disableddates.length; i++) {
                if ($.inArray(currentdate, disableddates) != -1 ) {
                    return [false];
                } 
            }

            return disableddates;
        }

        $( function() {
            $.datepicker.setDefaults($.datepicker.regional["es"]);
            $( "#datepicker" ).datepicker({
                dateFormat: 'yy-mm-dd',
                changeMonth:true,
                changeYear:true,
                yearRange: "2006:2017", 
                firstDay: 1,
                minDate: new Date(006, 12, 1), /** AAAA,MM,DD Fecha inicio */
                maxDate: new Date(2020, 11, 31), /** AAAA,MM,DD Fecha Fin */

                monthNames: ['Enero', 'Febrero', 'Marzo',
                'Abril', 'Mayo', 'Junio',
                'Julio', 'Agosto', 'Septiembre',
                'Octubre', 'Noviembre', 'Diciembre'],
                monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun',
                'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
                dayNamesMin: ['Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab'],
                beforeShowDay: DisableSpecificDates
            });
        });
    </script>
</body>
</html>
Origen Enlace
Alvarez
  • 4k
  • 4
  • 18
  • 39

tienes que declarar un array para almacenar todos los dias feriados alli. Asi lo logras:

<!DOCTYPE html>
<html>
<head>
    <title>Prueba</title>
</head>
<body>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>
    <div>
        <label for="datepicker">Selecciona Fecha:</label>
        <input type="text" id="datepicker"/>
    </div>


    <script type="text/javascript">

        var disableddates = ["8-3-2017", "12-11-2016", "8-25-2017", "8-20-2017"];

        function DisableSpecificDates(date) {

            var m = date.getMonth();
            var d = date.getDate();
            var y = date.getFullYear();
            var currentdate = (m + 1) + '-' + d + '-' + y ;

            for (var i = 0; i < disableddates.length; i++) {


                if ($.inArray(currentdate, disableddates) != -1 ) {
                    return [false];
                } 
            }

            return disableddates;
        }

        $(function() {
            $( "#datepicker").datepicker({
                beforeShowDay: DisableSpecificDates
            });
        });
    </script>
</body>
</html>

Este es solo un ejemplo, lo puedes adaptar a tus necesidades.