how to disable user key in/type in in daterangepicker

[afiqdoherty]

hi,

appreciate if you can help me to disable user key/type in for daterangepicker. I just want user to only select the date range from given date selection. 

This is because, I only want user to just follow this format date. My actual daterangepicker has button search after user select the date range. I don't want system to check on client side or server side validation for date format input by user themselves by key/type in. Hope you can understand my requirement.

my code :

<div class="col-md-3" style="font-weight:bold;">

   <ejs-daterangepicker id="daterangepickerFor" style="font-weight:bold;" value="@ViewData["daterange"]" placeholder="@ViewData["daterange"]" name="daterange" format="dd/MM/yyyy " ejs-for="@Model.Search_DateValue"></ejs-daterangepicker>

</div>

<div class="col-md-1">

  <ejs-button id="normalbtn" content="Search" type="submit" isPrimary="true" cssClass="e-outline"></ejs-button>

</div>

Thanks,

afiq

[Deepa Loganathan]

Hi Afiq,  

 

Thanks for contacting Syncfusion support.  

  

We understood your requirement to restrict the user from entering the values in Daterangepicker with input element and allow inputs only with popup selection.  This requirement can be achieved by setting the allowEdit API to false as given below.  

 

<ejs-daterangepicker id="daterangepickerFor" style="font-weight:bold;" placeholder="@ViewData["daterange"]" name="daterange" format="dd/MM/yyyy" allowEdit="false"></ejs-daterangepicker> 

 

 

We suggest you checking out our API help document to explore more about the options available in Daterangepicker.  

 

API:  https://ej2.syncfusion.com/documentation/api/daterangepicker/dateRangePickerModel  

Regards,  

Deepa L.