How do you create date and time picker in onsenui? - angularjs

How do you create date and time picker in onsenui?
I couldn't find any thing in their documentation and don't even know where to start.

You can also use html5 attribute like date and time to create datepicker in onsenui. for example
<input type="date" class="text-input" ng-model="inputDate"/>
You can look more details in here

The easiest way is to use Monaca, the browser based IDE from the same OnsenUI's company. You can find how to add this dateTime picker in their document. This will work for both iOS and Android. You can also add OnsenUI and PhoneGap DateTime Picker plugin right from the IDE. Therefore, you don't need to add the plugin one by one. Below is the screenshot of the OnsenUI with Datetime Picker:
https://www.dropbox.com/s/bgmk7b3e90nf75k/2014-09-02%2014.06.38.png?dl=0
Here is how to add the dateTime picker for Android.
I hope this helps. Cheer.

Related

Datetime range picker for angularjs version 1.2.13

I am developing a website in angularjs 1.2.13.Now I need a date time range picker to set the start date and expiry for a product.I googled in a number of sites.But I didn't get a plugin for angular version 1.2.13.If anybody knows the plugin work in angular version 1.2.13 please help me.Thanks in advance.

how add a native datepicker in ionic project?

If I do:
<input type="date">
I have this datepicker:
And I need the natives like this one:
You are running your app in the browser, that's why the date picker looks like that.
Just run your app on an emulator or a real device to get the native date picker.
In order to use Native date-picker, you should use the cordova plugin.
Take into account that I will render differently according to the platform.
https://github.com/VitaliiBlagodir/cordova-plugin-datepicker

Nativescript calendar plugin

Can anyone tell me how to use the calendar plugin in nativescript? And I am using only XML not with typescript. I need the calendar control exactly like as in Bookmyshow.
There are several options for calendar plugin.
The most extended one is the telerik-ui for NativeScript
The calendar is highly customisable and offers a lof of functionality.
You can see more about it here - keep in mind that this is a paid functionality.
Another option is to search for community-made nativescript calendar related plugins. Like this one here! Not familiar with it - it looks easy to work with.
The third option is to use date-picker. IF you are looking for a calendar in Android then you can open your app/App_Resources/Android/values-21 folder and open the file styles.xml and modify the default mode of the date picker from spinner to calendar.
Example:
<item name="android:datePickerMode">calendar</item>
You might be interested in the "Telerik UI for NativeScript" plugin. There is a free and pro version which contains a really slick looking and functioning calendar UI component.
More details about the plugins and their contents can be found here. Additionally you can take a look at the sdk examples regarding the RadCalendar component for both vanila and Angular 2 NativeScript.
I'm using this npm package:
https://www.npmjs.com/package/nativescript-calendar
"nativescript-calendar": "^1.0.7",
I juss created a wrapper over android-lib which help in rendering calendar in nativescript. checkout the plugin
https://www.npmjs.com/package/nativescript-calendar-weekview

Selecting Calendar Control in Edge using Selenium

I am trying to select a date from a date picker in MS Edge using Selenium. I have tried the following:
DateTime today = DateTime.Today;
string s_today = today.AddMonths(2).ToString("MM/dd/yyyy");
IWebElement endDate= Browser.Driver.FindElement(By.CssSelector("input[type='date']")); endDate.SendKeys(s_today);
And I even tried to create a method that takes that date reformats it and then sends that date to the date picker control
string dt = String.Format("{0:MMddyyyy}", s_today);
endDate.SendKeys(dt);
endDate.SendKeys("{Tab}");
I cannot seem to seem to select a date. I reviewed the link below and found nothing. Please help me. This is a ReactJS web app. Attached are screen shots.
How to automate selection of a particular date from calendar in selenium using java
Date Picker in Edge
DOM for Date Picker
I know this is a late answer but this is a confirmed bug in the Edge implementation of those particular input types.
Refer to the Cannot SendKeys on input control bug report on the edge bug tracker.
You can work around the problem by using JavascriptExecutor in selenium, or directly calling /session/:sessionId/execute and injecting your script in the Http request.
Regardless, at the moment it boils down to implementing your own sendKeys in javascript and injecting the javascript using selenium.

Hijri dates integration with jQuery UI datepicker tool

I have been using jQuery UI datepicker tool, it works fine, but now i want to integrate Hijri calendar in it instead of default gregorian calendarI saw a localization option in detailed options, it has an Arabic option, but it's not showing up Hijri datesis there any external plugins which i can integrate with datepicker tool which would support Hijri calendarAny help will be greatly appreciated

Resources