Blazor

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class SfDateRangePicker<TValue>

    Show / Hide Table of Contents

    Class SfDateRangePicker<TValue>

    The DateRangePicker is a graphical user interface component that allows user to select the date range from the calendar.

    Inheritance
    System.Object
    SfBaseComponent
    SfInputTextBase<TValue>
    CalendarBase<TValue>
    SfDateRangePicker<TValue>
    Implements
    IDateRangePicker
    Inherited Members
    CalendarBase<TValue>.ChangeEvent(EventArgs)
    Syncfusion.Blazor.Calendars.CalendarBase<TValue>.SetParametersAsync(Microsoft.AspNetCore.Components.ParameterView)
    CalendarBase<TValue>.CalendarEditContext
    CalendarBase<TValue>.Max
    CalendarBase<TValue>.Min
    CalendarBase<TValue>.FirstDayOfWeek
    CalendarBase<TValue>.CalendarMode
    CalendarBase<TValue>.DayHeaderFormat
    CalendarBase<TValue>.Depth
    CalendarBase<TValue>.KeyConfigs
    CalendarBase<TValue>.Start
    CalendarBase<TValue>.ServerTimezoneOffset
    CalendarBase<TValue>.ShowTodayButton
    CalendarBase<TValue>.WeekNumber
    CalendarBase<TValue>.WeekRule
    SfInputTextBase<TValue>.CONTROL_CONTAINER
    SfInputTextBase<TValue>.CONTROL_OLD_CONTAINER
    SfInputTextBase<TValue>.INPUTGROUP
    SfInputTextBase<TValue>.CLEARICONHIDE
    SfInputTextBase<TValue>.MULTILINE
    SfInputTextBase<TValue>.DISABLE
    SfInputTextBase<TValue>.INPUT
    SfInputTextBase<TValue>.INPUTFOCUS
    SfInputTextBase<TValue>.FLOATINPUT
    SfInputTextBase<TValue>.FLOATTEXT
    SfInputTextBase<TValue>.FLOATLABELBOTTOM
    SfInputTextBase<TValue>.FLOATLABELTOP
    SfInputTextBase<TValue>.INCREMENT_TITLE
    SfInputTextBase<TValue>.DECREMENT_TITLE
    SfInputTextBase<TValue>.INCREMENT
    SfInputTextBase<TValue>.DECREMENT
    SfInputTextBase<TValue>.DISABLED_ATTR
    SfInputTextBase<TValue>.ARIA_DISABLED
    SfInputTextBase<TValue>.APPEND
    SfInputTextBase<TValue>.PREPEND
    SfInputTextBase<TValue>.CLEAR_ICON_HIDE
    SfInputTextBase<TValue>.GROUP_ICON
    SfInputTextBase<TValue>.SPACE
    SfInputTextBase<TValue>.SPIN_DOWN
    SfInputTextBase<TValue>.SPIN_UP
    SfInputTextBase<TValue>.DISABLE_ICON
    SfInputTextBase<TValue>.OnInitializedAsync()
    SfInputTextBase<TValue>.OnParametersSetAsync()
    SfInputTextBase<TValue>.OnAfterRenderAsync(Boolean)
    SfInputTextBase<TValue>.OnInputHandler(ChangeEventArgs)
    SfInputTextBase<TValue>.OnPasteHandler(ClipboardEventArgs)
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.BlurHandler()
    SfInputTextBase<TValue>.OnChangeHandler(ChangeEventArgs)
    SfInputTextBase<TValue>.WireClearBtnEvents()
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.OnChange
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.OnInput
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.OnPaste
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.OnBlur
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.OnFocus
    SfInputTextBase<TValue>.ID
    SfInputTextBase<TValue>._value
    SfInputTextBase<TValue>.InputEditContext
    SfInputTextBase<TValue>.CssClass
    SfInputTextBase<TValue>.EnablePersistence
    SfInputTextBase<TValue>.EnableRtl
    SfInputTextBase<TValue>.Enabled
    SfInputTextBase<TValue>.ValidateOnInput
    SfInputTextBase<TValue>.MultilineInput
    SfInputTextBase<TValue>.BaseTabIndex
    SfInputTextBase<TValue>.BaseAutocomplete
    SfInputTextBase<TValue>.ContainerAttr
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.SpinButton
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.ValueTemplate
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.IsValueTemplate
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.ClickStopPropagation
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.MouseDowSpinnerPrevent
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.PreventIconHandler
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.MousePreventContainer
    SfInputTextBase<TValue>.ListOfButtons
    SfInputTextBase<TValue>.DataId
    SfInputTextBase<TValue>.inputAttr
    SfInputTextBase<TValue>.containerAttributes
    SfInputTextBase<TValue>.FloatLabel
    SfInputTextBase<TValue>.ClearElement
    SfInputTextBase<TValue>.IsFocused
    SfInputTextBase<TValue>.IncrementTitle
    SfInputTextBase<TValue>.DecrementTitle
    SfInputTextBase<TValue>.IsClearButtonClicked
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.ContainerClass
    SfInputTextBase<TValue>.ComponentReference
    SfBaseComponent.Dispose()
    SfBaseComponent.Dispose(Boolean)
    SfBaseComponent.OnObservableChange(String, Object, Boolean, NotifyCollectionChangedEventArgs)
    Namespace: Syncfusion.Blazor.Calendars
    Assembly: Syncfusion.Blazor.dll
    Syntax
    public class SfDateRangePicker<TValue> : CalendarBase<TValue>, IDateRangePicker
    Type Parameters
    Name Description
    TValue

    Specifies the type of SfDateRangePicker.

    Constructors

    SfDateRangePicker()

    Declaration
    public SfDateRangePicker()

    Properties

    AllowEdit

    Specifies a boolean value whether the DateRangePicker allows user to change the value via typing. When set as false, the DateRangePicker allows user to change the value via picker only.

    Declaration
    public bool AllowEdit { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, If the DateRangePicker value can be edited. otherwise, false. The default value is true.

    BaseFloatLabelType

    Declaration
    protected override FloatLabelType BaseFloatLabelType { get; set; }
    Property Value
    Type Description
    FloatLabelType
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.BaseFloatLabelType

    BaseHtmlAttributes

    Declaration
    protected override Dictionary<string, object> BaseHtmlAttributes { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.Dictionary<System.String, System.Object>
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.BaseHtmlAttributes

    BaseInputAttributes

    Declaration
    protected override Dictionary<string, object> BaseInputAttributes { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.Dictionary<System.String, System.Object>
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.BaseInputAttributes

    BaseIsReadOnlyInput

    Declaration
    protected override bool BaseIsReadOnlyInput { get; set; }
    Property Value
    Type Description
    System.Boolean
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.BaseIsReadOnlyInput

    BasePlaceholder

    Declaration
    protected override string BasePlaceholder { get; set; }
    Property Value
    Type Description
    System.String
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.BasePlaceholder

    BaseReadonly

    Declaration
    protected override bool BaseReadonly { get; set; }
    Property Value
    Type Description
    System.Boolean
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.BaseReadonly

    BaseShowClearButton

    Declaration
    protected override bool BaseShowClearButton { get; set; }
    Property Value
    Type Description
    System.Boolean
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.BaseShowClearButton

    BaseWidth

    Declaration
    protected override string BaseWidth { get; set; }
    Property Value
    Type Description
    System.String
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.BaseWidth

    EndDate

    Gets or sets the end date of the date range selection.

    Declaration
    public TValue EndDate { get; set; }
    Property Value
    Type Description
    TValue

    Accepts the end date of date range selection.

    EndDateChanged

    Triggers when end date of the DateRangePicker is changed.

    Declaration
    public EventCallback<TValue> EndDateChanged { get; set; }
    Property Value
    Type Description
    Microsoft.AspNetCore.Components.EventCallback<TValue>

    EndDateExpression

    Specifies the expression for defining the end date of the bound.

    Declaration
    public Expression<Func<TValue>> EndDateExpression { get; set; }
    Property Value
    Type Description
    System.Linq.Expressions.Expression<System.Func<TValue>>

    An expression that defines the end date of the bound.

    FloatLabelType

    Gets or sets the floating label behavior of the DateRangePicker that the placeholder text floats above the DateRangePicker based on the following values.

    Possible values are:

    • NeverNever floats the label in the DateRangePicker when the placeholder is available.
    • AlwaysThe floating label always floats above the DateRangePicker.
    • AutoThe floating label floats above the DateRangePicker after focusing it or when enters the value in it.
    Declaration
    public FloatLabelType FloatLabelType { get; set; }
    Property Value
    Type Description
    FloatLabelType

    The floating label behavior of the DateRangePicker.

    Format

    Gets or sets the required date format to the start and end date string.

    By default, the format is based on the culture.

    You can set the format to "format:'dd/MM/yyyy hh:mm'".

    Declaration
    public string Format { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value that specified the required date format for start and end date strings. The default culture format is M/d/yyyy.

    HtmlAttributes

    You can add the additional html attributes such as styles, class, and more to the root element. If you configured both property and equivalent html attributes, then the component considers the property value.

    Declaration
    public Dictionary<string, object> HtmlAttributes { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.Dictionary<System.String, System.Object>

    A dictionary of additional HTML attributes for the root element of the DateRangePicker.

    InputAttributes

    You can add the additional input attributes such as disabled, value, and more to the root element. If you configured both property and equivalent input attribute, then the component considers the property value.

    Declaration
    public Dictionary<string, object> InputAttributes { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.Dictionary<System.String, System.Object>

    A dictionary containing additional input attributes such as disabled, value and others that can be added to the root element.

    MaxDays

    Gets or sets the maximum span of days that can be allowed in a date range selection.

    Declaration
    public Nullable<int> MaxDays { get; set; }
    Property Value
    Type Description
    System.Nullable<System.Int32>

    An integer value representing the maximum span of days that can be allowed in a date range selection.

    MinDays

    Gets or sets the minimum span of days that can be allowed in date range selection.

    Declaration
    public Nullable<int> MinDays { get; set; }
    Property Value
    Type Description
    System.Nullable<System.Int32>

    An integer value representing the minimum span of days that can be allowed in a date range selection.

    Placeholder

    Gets or sets the text that is shown as a hint or placeholder until the user focuses or enter a value in DateRangePicker. The property is depending on the FloatLabelType property.

    Declaration
    public string Placeholder { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value.

    Presets

    Specifies the Presets of the dateRangePicker popup element.

    Declaration
    public List<Presets> Presets { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.List<Presets>

    Accepts the list of Presets objects. The default value is an empty list.

    Readonly

    Specifies a boolean value whether the DateRangePicker allows the user to change the text.

    Declaration
    public bool Readonly { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the DateRangePicker value cannot be edited; otherwise, false. The default value is false.

    RootClass

    Declaration
    protected override string RootClass { get; set; }
    Property Value
    Type Description
    System.String
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.RootClass

    Separator

    Sets or gets the string that used between the start and end date string.

    Declaration
    public string Separator { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value. The default value is "-".

    ShowClearButton

    Specifies whether to show or hide the clear icon in DateRangePicker.

    Declaration
    public bool ShowClearButton { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the clear icon was shown; otherwise, false. The default value is false.

    StartDate

    Gets or sets the start date of the date range selection.

    Declaration
    public TValue StartDate { get; set; }
    Property Value
    Type Description
    TValue

    Accepts the start date of date range selection, represented as a value of type TValue.

    StartDateExpression

    Specifies the expression for defining the start date of the bound.

    Declaration
    public Expression<Func<TValue>> StartDateExpression { get; set; }
    Property Value
    Type Description
    System.Linq.Expressions.Expression<System.Func<TValue>>

    An expression that defines the start date of the bound.

    StrictMode

    Specifies the DateRangePicker to act as strict. So that, it allows to enter only a valid date value within a specified range or else it will resets to previous value.

    By default, StrictMode is in false. It allows invalid or out-of-range date value with highlighted error class.

    Declaration
    public bool StrictMode { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if this property won't allow to enter an invalid date; otherwise, false It allows invalid or out-of-range date value with highlighted error class. The default value is false.

    Value

    Gets or sets the selected date of the Calendar.

    Declaration
    public object Value { get; set; }
    Property Value
    Type Description
    System.Object

    Accepts the selected date of calendar.

    ValueChanged

    Specifies the callback to trigger when the value changes.

    Declaration
    public EventCallback<object> ValueChanged { get; set; }
    Property Value
    Type Description
    Microsoft.AspNetCore.Components.EventCallback<System.Object>

    ValueExpression

    Specifies the expression for defining the value of the bound.

    Declaration
    public Expression<Func<object>> ValueExpression { get; set; }
    Property Value
    Type Description
    System.Linq.Expressions.Expression<System.Func<System.Object>>

    An expression that defines the value of the bound.

    Width

    Specifies the width of the DateRangePicker component.

    Declaration
    public string Width { get; set; }
    Property Value
    Type Description
    System.String

    Accepts the string value.

    ZIndex

    specifies the z-index value of the DateRangePicker popup element.

    Declaration
    public int ZIndex { get; set; }
    Property Value
    Type Description
    System.Int32

    Accepts an integer value. The default value is 1000.

    Methods

    BuildRenderTree(RenderTreeBuilder)

    Declaration
    protected override void BuildRenderTree(RenderTreeBuilder __builder)
    Parameters
    Type Name Description
    Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder __builder

    ChangeHandler(ChangeEventArgs)

    Declaration
    protected override Task ChangeHandler(ChangeEventArgs args)
    Parameters
    Type Name Description
    Microsoft.AspNetCore.Components.ChangeEventArgs args
    Returns
    Type Description
    System.Threading.Tasks.Task
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.ChangeHandler(Microsoft.AspNetCore.Components.ChangeEventArgs)

    CurrentView()

    Gets the current view of the calendar.

    Declaration
    public string CurrentView()
    Returns
    Type Description
    System.String

    returns current view of the calendar.

    FocusAsync()

    Sets focus to the DateRangePicker component for interaction.

    Declaration
    public Task FocusAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task

    Task.

    FocusHandler(FocusEventArgs)

    Declaration
    protected override Task FocusHandler(FocusEventArgs args)
    Parameters
    Type Name Description
    Microsoft.AspNetCore.Components.Web.FocusEventArgs args
    Returns
    Type Description
    System.Threading.Tasks.Task
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.FocusHandler(Microsoft.AspNetCore.Components.Web.FocusEventArgs)

    FocusOutAsync()

    Remove focus from the DateRangePicker component, if the component is in focus state.

    Declaration
    public Task FocusOutAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task

    Task.

    FocusOutHandler(FocusEventArgs)

    Declaration
    protected override Task FocusOutHandler(FocusEventArgs args)
    Parameters
    Type Name Description
    Microsoft.AspNetCore.Components.Web.FocusEventArgs args
    Returns
    Type Description
    System.Threading.Tasks.Task
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.FocusOutHandler(Microsoft.AspNetCore.Components.Web.FocusEventArgs)

    FormatValue(String)

    Declaration
    protected override TValue FormatValue(string genericValue = null)
    Parameters
    Type Name Description
    System.String genericValue
    Returns
    Type Description
    TValue
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.FormatValue(System.String)

    FormatValueAsString(TValue)

    Declaration
    protected override string FormatValueAsString(TValue formatValue)
    Parameters
    Type Name Description
    TValue formatValue
    Returns
    Type Description
    System.String
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.FormatValueAsString(TValue)

    GetPersistData()

    Gets the properties to be maintained in the persisted state.

    Declaration
    public Task<string> GetPersistData()
    Returns
    Type Description
    System.Threading.Tasks.Task<System.String>

    Task.

    HidePopupAsync()

    Hide the calendar popup.

    Declaration
    public Task HidePopupAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task

    Task.

    InputHandler(ChangeEventArgs)

    Declaration
    protected override Task InputHandler(ChangeEventArgs args)
    Parameters
    Type Name Description
    Microsoft.AspNetCore.Components.ChangeEventArgs args
    Returns
    Type Description
    System.Threading.Tasks.Task
    Overrides
    Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.InputHandler(Microsoft.AspNetCore.Components.ChangeEventArgs)

    ShowPopupAsync()

    Opens the popup to show the calendar.

    Declaration
    public Task ShowPopupAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task

    Task.

    UpdateChildProperties(Object)

    Update the children properties.

    Declaration
    public void UpdateChildProperties(object presetValue)
    Parameters
    Type Name Description
    System.Object presetValue

    Specifies the preset values.

    UpdateHeaders()

    Update the header properties.

    Declaration
    public void UpdateHeaders()

    Implements

    IDateRangePicker
    Back to top Generated by DocFX
    Copyright © 2001 - 2023 Syncfusion Inc. All Rights Reserved