DateRange selection

[Alex Whittle]

I have a server side Blazor application and trying to use the DateRangePicker control and using the following 

 <DateRangePickerEvents ValueChange="@valueChangeAsync"></DateRangePickerEvents>

 private async Task valueChangeAsync(Syncfusion.EJ2.Blazor.Calendars.RangeEventArgs args)

   {

        DateFrom = args.StartDate;

        DateTo = args.EndDate;

}

I am able to initially set DateFrom  and DateTo but valueChangeAsync is called multiple times and resets to the default values.

Any ideas?

[Narayanasamy Panneer Selvam]

Hi Alex, 

Greetings from Syncfusion support.

 

We have validated your issue from the shared code example. We were unable to reproduce the reported issue. 

We suspect that you may tried to update StartDate and EndDate value through change event. If you want to get updated value for StartDate and EndDate for every value change. Use two-way binding for respective property as follows, 

    <EjsDateRangePicker Value="@dateArray" @bind-StartDate="@DateFrom" @bind-EndDate="@DateTo"> 

        <DateRangePickerEvents ValueChange="@valueChangeAsync"></DateRangePickerEvents> 

    </EjsDateRangePicker> 

 

@code{ 

 

    public DateTime? DateFrom { get; set; } = DateTime.Now; 

    public DateTime? DateTo { get; set; } = new DateTime(2019, 11, 30); 

    public DateTime[] dateArray = new DateTime[2] { DateTime.Now, new DateTime(2019, 11, 30) }; 

    private async Task valueChangeAsync(Syncfusion.EJ2.Blazor.Calendars.RangeEventArgs args) 

    { 

 

        Console.WriteLine(DateFrom); 

        Console.WriteLine(DateTo); 

 

    } 

 

} 

Demo sample: https://www.syncfusion.com/downloads/support/forum/148870/ze/BlazorApp1_(2)838134349

Document Link: https://ej2.syncfusion.com/blazor/documentation/daterangepicker/data-binding/#two-way-data-binding 

 

Kindly let us know if you need further assistance on this.

 

Regards,
Narayanasamy P.