Skip to Content

Property 'Type' not available in DatePicker

Mar 29, 2017 at 11:47 AM


avatar image


I was trying to get a numeric keyboard when entering the date on a mobile device. According to the API though this is not possible;

'A date can be entered using a calendar that opens in a popup. Alternatively a value can be entered directly in the input field by typing it in. (This is only possible on desktop devices, on mobile devices keyboard input is not possible.)'

Entering data by directly typing is possible on a mobile device, but a regular keyboard shows up. I'd like a numeric keyboard to show up, because the user will only enter numbers. Normally you would get a numeric keyboard by entering the following:

<input type="Number">

Property type is not possible within the <DatePicker> somehow, so my question is:

1. Why is input through a keyboard possible on a mobile device, while the API claims that it is not?

2. Is there any work arounds so a numeric keyboard will show up when asking for the date?

Kind regards,


10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

1 Answer

A K Mar 29, 2017 at 12:06 PM

Agree, Datepicker has a property to set the month in a form of text/number. In this case, we can't restrict the user to enter the only number instead of date.

But the solution to your question is, why can't you use Input field with type number to get the date from user and pass the same to ODATA call?


Karthik A

Show 3 Share
10 |10000 characters needed characters left characters exceeded

I figured that out aswel, but at the moment the user has an option to either pick from the calendar or input it by using a keyboard. When I would use the input field, the calendar option would not be available anymore. I'd like both options available, so the user is able to choose whatever he prefers.

At the moment both options are available, the only downside is that a regular keyboards shows up instead of the numeric keyboard.


Use the below code

			  metadata : {
			  	    properties : {}
			  onAfterRendering : function(obj){
				  document.getElementById(this.sId + "-inner").type = "number";
			  renderer: {}
 		return new sap.m.Page({
			title: "Title",
			content: [
			          new DatePicker1()


Thanks for the suggestion, tried it. But it would not work. I think it has something to do with the fact that you can force the element to get the type="number", but as long as the attributes to type is not specified, it will not do anything with it.