We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Date Picker Selected Date

Thread ID:





133020 Oct 4,2017 11:07 AM UTC Oct 9,2017 06:40 AM UTC ASP.NET MVC 3
Tags: DatePicker
Frankie Moran
Asked On October 4, 2017 11:07 AM UTC


Looking for a bit of help with the Date Picker Control. 

I have implemented a Date Pickers on a page. One of them is for a From Date, and the other one is for a To Date. 

1. The From Date needs to be a Sunday Date. So if the user clicks a Wednesday date it would go back to the last Sunday Date. For example, if I clicked the From Date and choose today's date (04/10/2017 [UK]) it would go back and select (01/09/2017 [UK]). This would work regardless of which day of the week was chosen (i.e. Monday - Friday).

2. The To Date needs to be a Saturday Date. This would work similarly as above, however, it would go forward to the Saturday Date. For example, if I clicked the To Date and choose today's date (04/10/2017 [UK]) it would go forward and select (07/10/2017 [UK]). This would work regardless of which day of the week was chosen (i.e. Monday - Friday).

Is there any where to implement this on the Date Picker Control? 


Prem Kumar Madhan Raj [Syncfusion]
Replied On October 5, 2017 12:57 PM UTC

Hi Frankie, 
Thanks for contacting Syncfusion support. 
We have checked with your query to set the selected date as Sunday or Saturday in the datepicker regardless to the day of the week selected. We have achieved your requirement by setting the selected date value to corresponding week’s Sunday / Saturday if the user is not selected these days.  Here once the invalid date selected means, it will reset the value to require day and this changes is processed in DatePicker Select event as we shown in below code example. 
<h3>From DatePicker</h3> 
@Html.EJ().DatePicker("FromDatePicker").ClientSideEvents(e=> e.Select("onFromSelect")) 
<h3>To DatePicker</h3> 
@Html.EJ().DatePicker("ToDatePicker").ClientSideEvents(e => e.Select("onToSelect")) 
    function onFromSelect(args) { 
        if (args.date.getDay() != 0) { 
            this.option("value", new Date(args.date.setDate(args.date.getDate() - args.date.getDay()))); 
            // Changes the date to the previous Sunday’s date. 
    function onToSelect(args) { 
        if (args.date.getDay() != 6) { 
            this.option("value", new Date(args.date.setDate(args.date.getDate() + (6 - args.date.getDay())))); 
            // changes the date to the Saturday’s date of the week. 
For your convenience, we have created a simple sample based on your requirement and attached in the below link. Please check it. 
Prem Kumar. M

Frankie Moran
Replied On October 6, 2017 09:16 AM UTC

This has worked perfectly! 

Much appreciated. 


Prem Kumar Madhan Raj [Syncfusion]
Replied On October 9, 2017 06:40 AM UTC

Hi Frankie, 
Thanks for the update. Please get back to us if you need any further assistance on this. 
Prem Kumar. M  


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon