Datepicker without timezone information

[R]

Hi, I am confused. I have a DatePicker not a DateTimePicker. The user picks a date, why would timezone be of any importance in this case? The user picks 2021-01-30, regardless of their location it will always be 2021-01-30 and not 2021-01-30 00:00-05:00.

I can I set the datepicker to simply set the date without timezone info?

ServerTimezoneOffset does not work as I cannot know what is the offset of all the users.

[Ponmani Murugaiyan]

Hi R, 

Thanks for contacting Syncfusion support. 

By default DateTime will show both the Date and Time, you can remove the time portion and get the date using ToShortDateString as like below code snippet. 

https://stackoverflow.com/questions/6121271/how-to-remove-time-portion-of-date-in-c-sharp-in-datetime-object-only 

@using Syncfusion.Blazor.Calendars 

 

<p>DatePicker value is: @Date</p> 

 

<SfDatePicker TValue="DateTime" @bind-Value="@DateValue"></SfDatePicker> 

 

<button @onclick="@UpdateValue">Update Value</button> 

 

@code { 

    public DateTime DateValue { get; set; } = new DateTime(DateTime.Now.Year, DateTime.Now.Month, 28); 

    public string Date; 

    public void UpdateValue() 

    { 

        Date = DateValue.ToShortDateString(); 

    } 

} 

Output: 

 

Please get back us if you need further assistance. 

Regards, 

Ponmani M 

[R]

It's a DatePicker, when bound to a property should it not simply set the Datetime.Date to the property?

The way it is today is a bit misleading and allows people to inadvertently introduce bugs because people will simply not think that a DatePicker would return a DateTime with timezone.

Is there a way that when we bind the DatePicker to a property the DatePicker actually does the Property = Datetime.Date part?

[Ponmani Murugaiyan]

Hi R, 

Thanks for the update. 

Query: Is there a way that when we bind the DatePicker to a property the DatePicker actually does the Property = Datetime.Date part? 

 

Yes, you can achieve this requirement using the Date property, which extract the date component of a DateTime value with its time component set to zero (or 0:00:00, or midnight). You can update the bind-value variable with Date property to meet your requirement. 

https://docs.microsoft.com/en-us/dotnet/api/system.datetime.date?redirectedfrom=MSDN&view=net-5.0#System_DateTime_Date 

<p>DatePicker value is: @DateValue</p> 

 

<SfDatePicker TValue="DateTime" @bind-Value="@DateValue"></SfDatePicker> 

<button @onclick="@UpdateValue">Update Value</button> 

@code { 

    public DateTime DateValue { get; set; } = DateTime.Now; 

    public void UpdateValue() { 

        DateValue = DateValue.Date; 

    } 

} 

Kindly check with the above suggestion. If we misunderstood the query or if you need further assistance, please elaborate your requirement with more information, which helps us to check and provide you the solution at earliest. 

Regards, 

Ponmani M 

[Bob Vale]

That requires an "UpdateValue" method linked to interactive button, rather than automatically binding.

I have a similar problem, I want the model to update on lost focus by the automatic binding.

What we need is an extra parameter on the control that can turn a new feature on, or possibly a way to globally set this (maybe through injected service option class).

This feature if active would fire when the value changes and modify the value being passed to the ValueChanged callback.

I've currently got a similar effect by creating my on control we use in the project that just renders the SfDatePicker passing through Value, and ValueExpression and hooking ValueChanged to raise it's own ValueChanged callback with the modified value.  I actually have my ValueChanged as:

ValueChanged="@((DateTime?)x => x == null ? null : DateTime.SpecifyKind(DateTimeKind.Utc).Date)"



[Yohapuja Selvakumaran]

Hi Bob Vale,

Sorry for the delayed response. We have taken your requirement into account and have now successfully created a sample that includes a datepicker inside the edit form. The selected value will be automatically updated without the need for a button click. We hope this solution addresses your needs effectively. Kindly refer to the attached sample.

Regards,

Yohapuja

Attachment: DatePickerValidation_1e7d59e8.zip