I'm making a wrapper on top of TelerikDatePicker and this is how my component is working

<TelerikDatePicker T="TDate"
                   Value="@_value"
                   ValueChanged="@ValueChanged"
                   ValueExpression="@ValueExpression"
                   Enabled="@Enabled"
                   Class="@ClassMapper.AsString()"
                   Format="@Format" />

@code {

    // ... the other properties

    [Parameter]
    public virtual string Format { get; set; }

}

But here is the problem. This component will give me the error

Error: System.AggregateException: One or more errors occurred. (Value cannot be null. (Parameter 'input'))
 ---> System.ArgumentNullException: Value cannot be null. (Parameter 'input')
   at System.Text.RegularExpressions.Regex.Replace(String input, String replacement)
   at System.Text.RegularExpressions.Regex.Replace(String input, String pattern, String replacement)
   at Telerik.Blazor.Common.DateHelpers.FormatHelper.ExpandFormat(String format)
   at Telerik.Blazor.Common.DateHelpers.FormatHelper.ConvertToKendoIntl(String format)
   at Telerik.Blazor.Components.TelerikDateInputBase`1.GetDateInputOptions()
   at Telerik.Blazor.Components.TelerikDateInputBase`1.OnAfterRenderAsync(Boolean firstRender)

So another solution would be set it to string.Empty, but than it will have a different result when I don't pass the Format property.

Here are the cases:

    [Parameter]
    public virtual string Format { get; set; } // gives the error

    [Parameter]
    public virtual string Format { get; set; } = ""; // doesn't give the default result

I had to make a walkaround to not pass Format to the component for it to work

@if (!string.IsNullOrEmpty(Format))
{
    <TelerikDatePicker T="TDate"
                       Value="@_value"
                       ValueChanged="@ValueChanged"
                       ValueExpression="@ValueExpression"
                       Enabled="@Enabled"
                       Class="@ClassMapper.AsString()"
                       Format="@Format" />
}
else
{
    <TelerikDatePicker T="TDate"
                       Value="@_value"
                       ValueChanged="@ValueChanged"
                       ValueExpression="@ValueExpression"
                       Enabled="@Enabled"
                       Class="@ClassMapper.AsString()" />
}

What should I set as a default value to my wrapper's Format property so it doesn't give me the error and also get's the default value of Format?

Please don't say that I should keep the @if (!string.IsNullOrEmpty(Format)), it's so bad and I don't want to use telerik and still have to make walkarounds.

Many users would prefer to not have to use their mouse when entering data. This makes their job much more efficient when they can keep their hands in one place. I would expect to be able to type "05/22/2020" and also "05222020" into the datepicker but it keeps getting stuck on the day part. If you look at the demo for MVC, when you type those values, it accepts them but the demo for the Blazor datepicker does not.

ADMIN EDIT:

The MVC date picker does not have the described behavior. By default it is a simple <input> without validation so it will take any input, but typing in the numbers in sequence like that won't select a date. See the rest of the discussion and the updated title for more details on the behavior and issue this will fix.

</ADMIN EDIT>

To reproduce, go to https://demos.telerik.com/blazor-ui/datepicker/overview and tab into the datepicker input. Try typing "05/22/2020" and you will get a result of "5/20/yyyy" because it gets stuck on the dd section. 

To see the expected functionality, go to the MVC demo site (https://demos.telerik.com/aspnet-mvc/datepicker) and tab into the datepicker. Try typing "05/22/2020" and you will get a value of "05/22/2020" which is what it should be.

This should work when typing both "05/22/2020" and "05222020" since users will be even more efficient if they don't need to type the /.

When you use the DisabledDates parameter of the picker and it is null, the component throws an error that it cannot Select from the IEnumerable:

<TelerikDatePicker @bind-Value="@theValue" DisabledDates="@DisabledDates" />

@code{
    DateTime theValue { get; set; }
    List<DateTime> DisabledDates { get; set; }
}

Delete the input, choose a date from the dropdown. The issue is that the first picker remains invalid, while it is valid, a keyboard interaction with the input is required to clear the invalid state.

Reproducible:

@using System.ComponentModel.DataAnnotations;

    <EditForm Model="ModelData">
        <DataAnnotationsValidator />
        <ValidationSummary />
        <br /><br />
        <span>Not nullable</span> @ModelData.Date<br />
        <Telerik.Blazor.Components.TelerikDatePicker @bind-Value="ModelData.Date" Min="DateTime.MinValue" Max="DateTime.MaxValue"></Telerik.Blazor.Components.TelerikDatePicker><br /><br />
        <span>Nullable</span> @ModelData.Date2<br />
        <Telerik.Blazor.Components.TelerikDatePicker @bind-Value="ModelData.Date2" Min="DateTime.MinValue" Max="DateTime.MaxValue"></Telerik.Blazor.Components.TelerikDatePicker><br /><br />
    </EditForm>

@code  {

    public MyModel ModelData { get; set; }

    protected override void OnInitialized()
    {
        ModelData = new MyModel();
    }

    public class MyModel
    {
        public string Name { get; set; }

        [Required(ErrorMessage = "Non nullable required")]
        public DateTime Date { get; set; } = DateTime.Today;

        [Required(ErrorMessage = "Nullable required")]
        public DateTime? Date2 { get; set; } = DateTime.Today;
    }
}

Hello,

I'm trying to integrate a blazor datepicker, and i will only want to display the months and navigate bye years.

But it does not work.

 <TelerikDatePicker View="@CalendarView.Year" BottomView="@CalendarView.Decade" Format="MM/yyyy"  @bind-Value="@selectedDate" @ref="theDatePicker"></TelerikDatePicker>

Thank you.

How to remove placeholder from DatePicker?

If I set DateFormat to "d" then DatePicker will have "d" as a placeholder which confuses my users. How can I set custom placeholder or remove the placeholder from the DatePicker control?

Best regards,

Robert

Setting Min and Max should also prevent the user from writing a date that is out of their range. At the moment, it only disables the dates in the calendar.

In the meantime, you can use validation to limit the user input.

Hi,

disabled dates are not working in DatePicker. When setting DisabledDates parameter nothing changes in DatePicker. Those dates can still be selected. It works as expected in Calendar control

The picture says it all!

Hello,

I have an issue with TelerikDatePicker globalization. It works fine at all, but "Today" has the same translation.

I've used code like this:

CultureInfo.DefaultThreadCurrentCulture = new CultureInfo(MyStringLanguage);

And it still works only for "days" and "months". Could you please tell about current situation about localization and globalization or maybe to suggest some different solution.

Thanks for your help.