I want to create an input form to allow a user to add the monthly recurring item in my application. The user can pick multiple dates from the month. After I googling I found AlloyUi datepicker using multiple type.
My questions are :
YUI().use(
'aui-datepicker',
function(Y) {
new Y.DatePicker({
trigger: 'textarea',
mask: '%m/%d/%y',
calendar: {
selectionMode: 'multiple'
},
popover: {
zIndex: 1
},
panes: 1
});
});
<link href="http://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css" rel="stylesheet" />
<script src="http://cdn.alloyui.com/3.0.1/aui/aui-min.js"></script>
<textarea class="form-control" type="text" placeholder="mm/dd/yy">09/07/18 — 09/08/18 — 09/19/18</textarea>
This looks promising for your purpose. see the demo link below:
var today = new Date();
var y = today.getFullYear();
$('#mdp-demo').multiDatesPicker({
addDates: ['10/14/'+y, '02/19/'+y, '01/14/'+y, '11/16/'+y],
numberOfMonths: [3,4],
defaultDate: '1/1/'+y
});
it serves your requirements:
demo link: http://dubrox.github.io/Multiple-Dates-Picker-for-jQuery-UI/#demo-full-year