Search code examples
telerik-blazor

Open telerik blazor DateRangePicker on calendar icon click


I need to open telerik blazor date range picker on calendor Icon click.
I was tried to find the solution but can not able to find proper that is work for me.
The telerik document have no such event to take care of it on different control click or may be I missed that. Can someone please help me with the same.

I tried to recall the DateRangePickerOpenEeventtArgs but not able to achieve it.

Thanks in advance!!

enter image description here


Solution

  • I found my answer in telerik document itself.
    We need to create a refType of TelerikDateRangePicker like below:

    <TelerikButton OnClick="@OpenPicker">Open DateRangePicker</TelerikButton>
    
    <TelerikDateRangePicker @ref="@DateRangePickerRef"
                            @bind-StartValue="@DateRangePickerStartValue"
                            @bind-EndValue="@DateRangePickerEndValue" />
    
    @code {
        // the component type depends on the value type, could be also DateTime?
        private TelerikDateRangePicker<DateTime> DateRangePickerRef { get; set; }
    
        private DateTime DateRangePickerStartValue { get; set; } = DateTime.Now;
    
        private DateTime DateRangePickerEndValue { get; set; } = DateTime.Now.AddDays(10);
    
        
        void OpenPicker()
        {
            DateRangePickerRef.Open();
        }
    }
    

    So that reference directly hit our control from methods.

    ref link : telerik blazor date range event handling