https://github.com/4xmen/mpdatepicker

Materialize Persian Datepicker
https://github.com/4xmen/mpdatepicker

4xmen date datepicker javascript jquery jquery-plugin material-datepicker matrial-ui persian-calendar persian-datepicker persian-datetime persian-datetime-picker picker right-to-left xstack

Last synced: about 1 month ago
JSON representation

Materialize Persian Datepicker

• Host: GitHub
• URL: https://github.com/4xmen/mpdatepicker
• Owner: 4xmen
• License: gpl-3.0
• Created: 2016-11-22T05:49:52.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2023-08-17T23:34:44.000Z (over 1 year ago)
• Last Synced: 2024-05-20T22:37:22.816Z (7 months ago)
• Topics: 4xmen, date, datepicker, javascript, jquery, jquery-plugin, material-datepicker, matrial-ui, persian-calendar, persian-datepicker, persian-datetime, persian-datetime-picker, picker, right-to-left, xstack
• Language: JavaScript
• Size: 165 KB
• Stars: 64
• Watchers: 4
• Forks: 11
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# mpdatepicker

Materialize Persian Date and time picker by A1Gard 4xmen.ir

## installation

+ npm:

    + `npm i mpdatepicker`

+ yarn:

    + `yarn add mpdatepicker`

## screenshot



![mp datetime picker](screenshot.png)



## How to use

Add jquery:

```html

```

Add additional font for best view or use [Vazir-Matn-Font](https://www.npmjs.com/package/vazirmatn):

```html

 

```

Add css and jquery plugin To end of your project:

```html

```

Add Html :

```Html

```     

use plugin :

```javascript

$(function () {

    $(".sample-date-picker").mpdatepicker({

        'timePicker': true,

        onOpen: function () {

            console.log('open');

        },

        onSelect: function (selected) {

            console.log('select', selected);

        },

        onChange: function (oldVal, newVal) {

            console.log('change', oldVal, newVal);

        },

        onClose: function () {

            console.log('close');

        },

    });

});

```

## Options & events

| name  | default  |  action  |

| ------------ | ------------ | ------------ |

| timePicker  |  `false`  |  time picker active or not  |

|  timeChangeSensitivity |  `5`  |  time picker sensitivity on drag up/down  |

| fontStyle  | `null`  | font style for modal  |

| gSpliter  |  `-` |  split date |

|  onOpen | event  | trigger when open modal  |

|  onClose | event  | trigger when close modal  |

|  onSelect | event  | trigger on select end   |

|  onChange  | event  |  trigger on change selected |