{"id":22350988,"url":"https://github.com/amittksharma/extended-datetimepicker","last_synced_at":"2025-07-30T07:31:35.528Z","repository":{"id":58244014,"uuid":"74309548","full_name":"amittkSharma/extended-datetimepicker","owner":"amittkSharma","description":"An Angular Material based, an Android style date-time picker, with ability to disable set of continuous or non-continuous date sets.","archived":false,"fork":false,"pushed_at":"2018-02-26T15:49:54.000Z","size":232,"stargazers_count":10,"open_issues_count":2,"forks_count":8,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-11-11T14:40:30.241Z","etag":null,"topics":["android-style","angular","angular-material","angularjs","calendar","calendar-widget","calendardirective","datetimepicker","extended-datetimepicker","moment","picker"],"latest_commit_sha":null,"homepage":"http://rawgit.com/amittkSharma/extended-datetimepicker/master/index.html","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/amittkSharma.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-11-20T23:30:00.000Z","updated_at":"2024-02-13T22:35:11.000Z","dependencies_parsed_at":"2022-08-31T04:40:29.694Z","dependency_job_id":null,"html_url":"https://github.com/amittkSharma/extended-datetimepicker","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amittkSharma%2Fextended-datetimepicker","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amittkSharma%2Fextended-datetimepicker/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amittkSharma%2Fextended-datetimepicker/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amittkSharma%2Fextended-datetimepicker/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/amittkSharma","download_url":"https://codeload.github.com/amittkSharma/extended-datetimepicker/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":228106579,"owners_count":17870437,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android-style","angular","angular-material","angularjs","calendar","calendar-widget","calendardirective","datetimepicker","extended-datetimepicker","moment","picker"],"created_at":"2024-12-04T12:12:03.000Z","updated_at":"2024-12-04T12:12:03.596Z","avatar_url":"https://github.com/amittkSharma.png","language":"JavaScript","readme":"# Angular Material DateTimePicker\n\n[![](https://img.shields.io/npm/v/extended-datetimepicker.svg)](https://www.npmjs.com/package/extended-datetimepicker)\n[![](https://img.shields.io/npm/dm/extended-datetimepicker.svg)](https://www.npmjs.com/package/extended-datetimepicker)\n\nAn Angular Material based, an Android style date-time picker. Some basic functionalities are:\n\n- Double click to select date or time\n- Swipe left to go to next month or Swipe right to go to previous month.\n- Disable the set of continous or non-continous date sets.\n- Jump to current day\n- Highlight Week days (Business Days)\n- Display week number (in header)\n- Weekdays as per browser language\n\n\n\n## Updates\n| Date\t\t\t\t| Author\t\t\t| Description\t\t\t\t\t\t\t\t\t\t  |\n| ----------------- | ----------------- | --------------------------------------------------- |\n| 2016-11-21\t\t| AmittK\t\t    | Extended version of angular-material-datetimepicker |\n| 2017-04-14\t\t| AmittK\t\t    | Changes to the display structure of date and month  |\n| 2017-07-26\t\t| AmittK\t\t    | Jump to today date is introduced                    |\n| 2017-07-28\t\t| AmittK\t\t    | Highlight only week-days (working business days)    |\n| 2017-07-30\t\t| AmittK\t\t    | Displaying the week number in header, UI updated    |\n| 2017-07-30    \t| AmittK\t\t    | UI updated with icons and tooltips                  |\n\n\n\n### Dependencies\n\nDepends on the following library:\n\n- Angular Material \u0026 it's dependencies\n- Angular Touch\n- MomentJS\n\n## Installing via Bower\n\n```\nbower install extended-datetimepicker\n```\n\n## Installing via Npm\n\n```\nnpm install extended-datetimepicker\n```\n\n## Live Example\n\nClick [here] (http://rawgit.com/amittkSharma/extended-datetimepicker/master/index.html) to visualize live examples.\n\n## Usage\n\nAdd the plugin module as a dependency to your AngularJS module:\n\n```js\n    angular.module('myAwesomeModule', [\n      //other dependencies ignored\n      'ngMaterialDatePicker'\n    ]);\n```\n\nThis plugin exposes a directive which should be used as an attribute for an input element. The directive is\n`mdc-datetime-picker`. An example of this is given below:\n\n```html\n    \u003cmd-input-container flex-gt-md=\"30\"\u003e\n        \u003clabel\u003eTimepicker Only\u003c/label\u003e\n        \u003cinput mdc-datetime-picker date=\"false\" time=\"true\" type=\"text\" id=\"time\" short-time=\"true\"\n               placeholder=\"Time\"\n               min-date=\"minDate\"\n               format=\"hh:mm a\"\n               ng-model=\"time\"\u003e\n    \u003c/md-input-container\u003e\n```\n\n\n### Directive Attributes\n\nThe directive accepts several attributes which are described below:\n\n| Name\t\t\t\t| Type\t\t\t\t\t\t\t| Description\t\t\t\t\t\t\t\t\t|\n| ----------------- | ----------------------------- | --------------------------------------------- |\n| **ng-model**\t    | (String\\|Date\\|Moment)\t\t| Initial Date or model to assign the date to|\n| **format**\t\t| String\t\t\t\t\t\t| [MomentJS Format](momentjs.com/docs/#/parsing/string-format/),defaults to `HH:mm` for time picker only, `YYYY-MM-DD` for date picker only and `YYYY-MM-DD HH:mm` for both timepicker and date picker |\n| **short-time**\t| Boolean\t\t\t\t\t\t| true =\u003e Display 12 hours AM\\|PM \t\t\t\t|\n| **min-date**\t\t| (String\\|Date\\|Moment)\t\t| Minimum selectable date\t\t\t\t\t\t|\n| **max-date**\t\t| (String\\|Date\\|Moment)\t\t| Maximum selectable date\t\t\t\t\t\t|\n| **date**\t\t\t| Boolean\t\t\t\t\t\t| true =\u003e Has Datepicker (default: true)        |\n| **time**\t\t\t| Boolean\t\t\t\t\t\t| true =\u003e Has Timepicker (default: true)\t\t|\n| **cancel-text**\t| String\t\t\t\t\t\t| Text for the cancel button (default: Cancel)\t|\n| **ok-text**\t\t| String\t\t\t\t\t\t| Text for the OK button (default: OK)\t\t\t|\n| **disable-dates**\t| Date[]                        | Dates to be disabled or not selectable by user.   |\n| **week-days**\t    | Boolean                        | true =\u003e Highlight only working days (default: false). |\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Famittksharma%2Fextended-datetimepicker","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Famittksharma%2Fextended-datetimepicker","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Famittksharma%2Fextended-datetimepicker/lists"}