I have these scripts on my html page:
<!-- alpaca.js datetime date -->
<script type="text/javascript" src="https://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="https://trentrichardson.com/examples/timepicker/jquery-ui-timepicker-addon.js"></script>
<link type="text/css" rel="stylesheet" href="https://trentrichardson.com/examples/timepicker/jquery-ui-timepicker-addon.css" />
And the code below assembles the alpaca form:
$("#form").alpaca({
"schema": {
"properties" : {
"name": {
"type":"string",
"title":"Name",
"required":true
},
"datetime": {
"title": "Datetime",
"description": "Pick your datetime.",
"format": "datetime"
}
}
},
"options": {
"fields" : {
"name": {
"type" : "text",
"size": 20
},
"datetime": {
"type": "datetime",
"picker": {
"format": "DD/MM/YYYY HH:mm:ss"
},
"manualEntry": true
}
}
}
});
But the datetime field doesn't allow me to enter the date and time
The calendar pop-up that appears is unconfigured, I can't even change the month, for example.
Do I need to do anything else for this datetime field to work properly?
I solved the problem by changing the scripts.
I accessed the showcase Alpaca page and I inspected the HTML
I discovered the scripts and I replaced them on my page.
The scripts below:
<!-- alpaca.js datetime date -->
<script type="text/javascript" src="http://www.alpacajs.org/lib/jquery-ui/jquery-ui.js"></script>
<link type="text/css" rel="stylesheet" href="http://www.alpacajs.org/lib/jquery-ui/themes/cupertino/jquery-ui.min.css" />
<script type="text/javascript" src="http://www.alpacajs.org/lib/jqueryui-timepicker-addon/dist/jquery-ui-timepicker-addon.js"></script>
<link type="text/css" rel="stylesheet" href="http://www.alpacajs.org/lib/jqueryui-timepicker-addon/dist/jquery-ui-timepicker-addon.css" />
<script type="text/javascript" src="http://www.alpacajs.org/lib/moment/min/moment-with-locales.min.js"></script>
<script type="text/javascript" src="http://www.alpacajs.org/lib/eonasdan-bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js"></script>
<link type="text/css" rel="stylesheet" href="http://www.alpacajs.org/lib/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.css"/>