vue-jquery-calendar
vue-jquery-calendar
is wrapper vue package of jquery ui datepicker
Installation
npm install --save vue-jquery-calendar
Or using yarn
yarn add vue-jquery-calendar -dev
For Installing plugin import vue-jquery-calendar
in your component page.
//foo.vue; components: VueJqueryCalendar
Note
Please note that this package depends on jQuery
and jquery-ui
, but you won't need to add it to your project manually, vue-jquery-calendar
will handle this for you automatically if this dependencies are not detected.
CSS
For vue-jquery-calendar
appearance import jquery-ui css in App.vue
main file
<style>@;</style>
Example App
try out this Code Sandbox
Basic Usage
You can pass an array of fullclendar objects through the props
...
Props
Name | Type | Default | Description |
---|---|---|---|
value | String |
null | Value of the input DOM |
showButtonPanel | Boolean |
false | To display a button pane underneath the calendar |
changeMonth | Boolean |
false | The month should be rendered as a dropdown instead of text |
changeYear | Boolean |
false | The year should be rendered as a dropdown instead of text |
numberOfMonths | Number |
1 | The number of months to display in a single row |
dateFormat | String |
'dd/mm/yy' | The format for parsed and displayed dates |
readonly | Boolean |
false | Calendar input field set as read-only mode |
className | String |
null | Calendar input class name set |
Events
Name | Description |
---|---|
change | get value on change date |