We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Setting min/max value for EditType.DateTimePickerEdit in grid

Thread ID:

Created:

Updated:

Platform:

Replies:

148162 Oct 8,2019 04:56 PM UTC Mar 10,2020 04:50 AM UTC Blazor 7
loading
Tags: Grid
Michael Lambert
Asked On October 8, 2019 04:56 PM UTC

How do I set the Min Date/Max Date values for a EditType.DateTimePickerEdit in the grid:

        <GridColumn Field=@nameof(TimeSheets.DateStart) HeaderText="Start" Width="70" Format="yMd" TextAlign="TextAlign.Right" EditType="EditType.DateTimePickerEdit" Type="ColumnType.Date"  ValidationRules="@(new { required = true })"></GridColumn>

Thanks,
Mike

Vignesh Natarajan [Syncfusion]
Replied On October 9, 2019 08:11 AM UTC

Hi Michael,  

Greetings from Syncfusion support.  

Query: “How do I set the Min Date/Max Date values for a EditType.DateTimePickerEdit in the grid 

We suggest you to achieve your requirement using Edit params feature of Grid. You can customize the default edit Types using Edit property of GridColumn. Refer the below code example  

@using Syncfusion.EJ2.Blazor.Calendars 
 
<EjsGrid TValue="Order" ID="Grid" AllowSorting="true" AllowFiltering="true" AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Delete", "Update", "Cancel" })"> 
    <GridColumns> 
    .        .        .     .           .         .  
    <GridColumn Field=@nameof(Order.OrderDate) HeaderText="Date" EditType="EditType.DateTimePickerEdit" Edit="@DateParams" Width="150"></GridColumn> 
    </GridColumns> 
</EjsGrid> 
 
@code{ 
    public static List<Order> Orders { get; set; } 
    public object DateParams = new 
    { 
@@params = new DateTimePickerModel { Max = DateTime.Now, Min = DateTime.Now.AddDays(-100) } 
}; 
} 

Note: to get the DateTimePicker model, you need refer the Syncfusion Calendars as highlighted above 

Refer our UG documentation for your reference 


Please get back to us if you have further queries.  

Regards, 
Vignesh Natarajan.  

Michael Lambert
Replied On October 9, 2019 11:30 PM UTC

That sorta worked.  It limited the selection in the dropdown, but the user can still enter by hand an invalid date.  How do I get validation for that?

Vignesh Natarajan [Syncfusion]
Replied On October 10, 2019 09:55 AM UTC

Hi Michael,  

Query: “It limited the selection in the dropdown, but the user can still enter by hand an invalid date 
 
We suggest you to achieve your requirement using StrictMode property of DateTimePicker. Enabling this property will allow the user to type the valid date and time between Min / Max values. If the entered value is invalid, the component stay with previous value. Else, if the datetime is out of range, then component will set the date time to the Min/Max value. 

Refer the below code example  

public object DateParams = new 
    { 
@@params = new DateTimePickerModel { Max = DateTime.Now, Min = DateTime.Now.AddDays(-100),StrictMode = true } 
}; 
  
Refer our UG documentation for your reference 


Above solution will prevent the user from saving the Invalid / out of range Date values, So, kindly confirm whether you want to display validation in column if the user type wrong values.  

Regards, 
Vignesh Natarajan. 


Michael Lambert
Replied On March 8, 2020 11:16 PM UTC

So I just updated to 17.4.54 from the Beta, now I get this error on this line:
     Error CS0305 Using the generic type 'DateTimePickerModel<T>' requires 1 type arguments
       public object DateParams = new {@@params = new DateTimePickerModel { Max = DateTime.Now, Min = DateTime.Now.AddDays(-40), StrictMode = true }};

<GridColumns>
        <GridColumn Field=@nameof(TimeSheets.Description) MaxWidth="200" HeaderText="Description" Width="120" ValidationRules="@(new { required= true, maxLength=50})"></GridColumn>
        <GridColumn Field=@nameof(TimeSheets.DateStart) HeaderText="Start" Width="70" CustomFormat="@(new { type ="date", format="MM/dd/yyyy HH:mm" })" TextAlign="TextAlign.Right" Edit="@DateParams" EditType="EditType.DateTimePickerEdit" Type="ColumnType.Date" ValidationRules="@(new { required = true })"></GridColumn>
…..

Obviously something changed between releases.  How do we now set the min/max of a DateTimePicker in a Grid?
Thanks,
Mike

Vignesh Natarajan [Syncfusion]
Replied On March 9, 2020 04:00 AM UTC

Hi Michael,  
 
Thanks for contacting Syncfusion support.  
 
Query1: “So I just updated to 17.4.54 from the Beta, now I get this error on this line && How do we now set the min/max of a DateTimePicker in a Grid 
 
In our 17.4.0.39, we have some major changes in our components and DateTimePicker components require TValue (its type) property to function properly. Please find the release notes regarding the same from below  
 
 
 
So kindly modify the code as below in your application.  
 
 public object DateParams = new    {@@params = new DateTimePickerModel<DateTime?> { Max = DateTime.Now, Min = DateTime.Now.AddDays(-100), StrictMode = true }};
 
 
For your convenience we have prepared a sample using 17.4.0.54v which can be downloaded from below  
 
 
Kindly get back to us if you have further queries.   
 
Regards, 
Vignesh Natarajan. 


Michael Lambert
Replied On March 9, 2020 03:46 PM UTC

Worked Thanks!

Vignesh Natarajan [Syncfusion]
Replied On March 10, 2020 04:50 AM UTC

Hi Michael, 

Thanks for the update.  

We are glad to hear that you have resolved your query. 

Kindly get back to us if you have further queries.  

Regards, 
Vignesh Natarajan. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon