Restrict user to manually enter in Date Picker

Click here and follow my SAP UI5/FIORI snippets and information Page

Date Picker would not allow to user to enter anything.You can only select the date.Go through it and please let me know in case of any issue/doubt.

Write below lines in view

<DatePicker displayFormat="dd MMM YYYY" valueFormat="dd MMM YYYY"
id="datePickerId" width="30%">
</DatePicker>

Write below lines in controller

onInit:function()
{
this.byId("datePickerId").setDateValue(new Date());
var date=this.byId("datePickerId").getDateValue();

},
onAfterRendering:function()
{
$("#"+this.byId("datePickerId").sId+"-inner").prop("readonly", true) ;
},

Result