Search code examples
javascriptjquerydatepickerzebra-ui-framework

Zebra Datepicker - Not working

I am trying to create a date picker with Zebra Datepicker jQuery Plugin.

What I have done is-

<html>
  <head>
    <link rel="stylesheet" type="text/css" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css">
    <link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.0.3/css/buttons.dataTables.min.css">
    <script type="text/javascript" language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script type="text/javascript" language="javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

        <!-- This 2 for jQuery UI -->
        <script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
        <script type="text/javascript" language="javascript" src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

        <script type="text/javascript" language="javascript" src="https://cdn.datatables.net/buttons/1.0.3/js/dataTables.buttons.min.js"></script>
        <script type="text/javascript" language="javascript" src="https://cdn.datatables.net/buttons/1.0.3/js/buttons.colVis.min.js"></script>

<link rel="stylesheet" type="text/css" href="https://raw.githubusercontent.com/stefangabos/Zebra_Datepicker/master/public/css/bootstrap.css">

<script type="text/javascript" language="javascript" src="https://raw.githubusercontent.com/stefangabos/Zebra_Datepicker/master/public/javascript/zebra_datepicker.src.js"></script>

  </head>
  <body>
        <input type="text" id="#datepicker-example1" name="anything" value="nai" placeholder="datepicker">
  </body>

    <script>
            $( document ).ready(function()
            {
                $('#datepicker-example1').Zebra_DatePicker();
            });
    </script>

</html>

But it is not working.

Can anybody help?

Solution

  • Make sure you include a <doctype> as stated on the creators website.

    http://stefangabos.ro/jquery/zebra-datepicker/

    Zebra_Datepicker has no dependencies other than jQuery 1.5.2+ but requires that the page you are using the plugin on to have a strict doctype like:

    <!doctype html>

    Also, instead of trying to get the scripts remotely from git, download them locally.

    Git is not a CDN and I suspect your requests are being denied.