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

Validation on datepicker in Grid template

Thread ID:

Created:

Updated:

Platform:

Replies:

147867 Sep 26,2019 10:01 AM UTC Oct 16,2019 10:25 AM UTC ASP.NET MVC 11
loading
Tags: Grid
Pio Luca Valvona
Asked On September 26, 2019 10:01 AM UTC

Hi,
I need to set the date format based on the culture used in the login,
this is the code I use in the view:

@{
    Layout = "~/Views/Shared/_Master.cshtml";
    ViewBag.Title = PLV.Web.Resources.Contratti.TitoloPagina;
    string datePattern = CultureInfo.CurrentCulture.DateTimeFormat.ShortDatePattern;
}

col.Field("DataContratto").Format("{0:" + datePattern + "}").EditType(EditingType.DateTimePicker).Add();

if (args.requestType == "beginedit" || args.requestType == "add") {
                $("#DataContratto").ejDatePicker({
                        locale: "@CultureInfo.CurrentCulture.TextInfo.CultureName",
                        width: '100%',
                        watermarkText: "@PLV.Web.Resources.Common.Selezionare",
                        buttonText:"@PLV.Web.Resources.Common.DataCorrente"
                });

….

The problem arises in the validation of dates, because each date entered generates an validity error.
I found that the date format set on the DatePicker controls correspond to the culture used.

Luca

Manivannan Padmanaban [Syncfusion]
Replied On September 27, 2019 11:30 AM UTC

Hi Luca, 

Greetings from Syncfusion Support. 

Query: The problem arises in the validation of dates, because each date entered generates an validity error. 

From the above query, we are able to understand that you have facing an issue with applying the localization to the DateTimePicker field. After validating the issue we could see that the DateTimePicker ID is taken incorrectly. In edit mode, Grid ID followed by the field name will give you the DateTimePicker ID. Refer the below code example, 

@{ 
    ……………… 
 
    string datePattern = CultureInfo.CurrentCulture.DateTimeFormat.ShortDatePattern; 
} 
@(Html.EJ().Grid<object>("FlatGrid") 
                ……………. 
                .Columns(col => 
                { 
………………………………………… 
                    col.Field("OrderDate").HeaderText("Order Date").TextAlign(TextAlign.Right).Width(100).Format("{0:" + datePattern + "}").EditType(EditingType.DateTimePicker).Add(); 
 
                }) 
) 
 
<script> 
    function complete(args) { 
        if (args.requestType == "beginedit" || args.requestType == "add") { 
            $("#FlatGridOrderDate").ejDatePicker({  // Grid ID followed by the field name. 
                locale: "@CultureInfo.CurrentCulture.TextInfo.CultureName", 
                width: '100%' 
            }); 
        } 
    } 
</script> 

Still facing the issue, please get back to us with the below details. 

  1. Share the Exact issue are you facing in detail.
  2. Share screenshot Or video demonstration of the issue.
  3. Share the complete Grid code example.

Regards, 
Manivannan Padmanaban. 


Pio Luca Valvona
Replied On September 27, 2019 04:33 PM UTC


Hi Manivannan,

If "Grid ID followed by the field name will give you the DateTimePicker ID", the Dropbox of the date disappears in the template. While debugging I verified that the DateTime control is localized correctly (it-IT) but, as you can see from the image, when inserting a date in the format dd/mm/yyyy, I get the error message. I think it's a date validation issue.
I'm attaching the code to the whole view.



Attachment: Contratti_dd928040.zip

Manivannan Padmanaban [Syncfusion]
Replied On September 30, 2019 01:02 PM UTC

Hi Luca, 

Thanks for the details. 

From the shared screenshot, we are able to understand that you have facing an date validation issue while entering the date in the datepicker but we are unable to reproduce the reported issue at our end. For your convenience we have created the sample based on the shared code example, kindly refer the below link for sample. 

After referred the above link, still facing the issue kindly get back to us with the below details. 

  1. Reproduce the reported issue in the shared sample Or share the issue reproducible sample.
  2. Share the Essential Studio version are you using.

Provided details will help us, to resolve the reported issue as earlier as possible. 

Regards, 
Manivannan Padmanaban. 
 


Pio Luca Valvona
Replied On October 1, 2019 09:48 AM UTC

Hi Manivannan,
thank you for support,

I saw the code in the example is I modified mine reporting the same changes.
But the problem recurs.
Can it be caused by using jquery.validate?
The version of Syncfusion used is: 17.2450.0.5.
The page originally worked, the problem occurred in the last builds, but they did not affect changes to the page.

Luca

Farveen Sulthana Thameeztheen Basha [Syncfusion]
Replied On October 2, 2019 03:43 PM UTC

Hi Luca, 

We are unable to reported problem at our end even at the latest version. We need some more additional details to find the cause of the issue. Share us the following details. 

  1. If possible replicate the issue in the above sample and revert us back.
  2. Share us the video Demo to replicate the issue.
  3. Share your Layout page.

Regards, 
Farveen sulthana T 


Pio Luca Valvona
Replied On October 2, 2019 05:01 PM UTC

Hi Luca, 

We are unable to reported problem at our end even at the latest version. We need some more additional details to find the cause of the issue. Share us the following details. 

  1. If possible replicate the issue in the above sample and revert us back.
  2. Share us the video Demo to replicate the issue.
  3. Share your Layout page.

Regards, 
Farveen sulthana T 


Hi Farveen,
thank you for support,

unfortunately I can't replicate the problem, but what I can tell you with certainty is that commenting on the following two lines in the BundleConfig would seem that the problem does not occur.

                        "~/Scripts/jquery.validate.min.js",
                        "~/Scripts/jquery.validate.unobtrusive.min.js",


At this point I think that, as I indicated in the previous post, it is due to the validation of Jquery.
Do you know if you can take action to keep this validation enabled?

Manivannan Padmanaban [Syncfusion]
Replied On October 3, 2019 06:06 AM UTC

Hi Luca, 

Thanks for the update. 

Grid uses the jquery.validate for validating the form fields. In this case, the change in the format of the Grid column fields will be validated differently by the jquery.validate. Due to this the reported issue will occur, in order to avoid the reported issue we suggest you to return the jquery validate as mentioned below. 

 
@(Html.EJ().Grid<object>("Grid")  
………………………….. 
                .Columns(col =>  
                {  
                    ……………… 
                });  
)  
  
 
 
 
<script>  
    jQuery.validator.methods["date"function (value, element) {  
        return true;  
    }  
</script>  


Regards, 
Manivannan Padmanaban. 


Pio Luca Valvona
Replied On October 3, 2019 09:22 AM UTC

Hi Luca, 

Thanks for the update. 

Grid uses the jquery.validate for validating the form fields. In this case, the change in the format of the Grid column fields will be validated differently by the jquery.validate. Due to this the reported issue will occur, in order to avoid the reported issue we suggest you to return the jquery validate as mentioned below. 

 
@(Html.EJ().Grid<object>("Grid")  
………………………….. 
                .Columns(col =>  
                {  
                    ……………… 
                });  
)  
  
 
 
 
<script>  
    jQuery.validator.methods["date"function (value, element) {  
        return true;  
    }  
</script>  


Regards, 
Manivannan Padmanaban. 


Hi Manivannan,
thank you for support,

The code you gave me works well.
Is there a way to put it in an external file, so I don't change all views?

Manivannan Padmanaban [Syncfusion]
Replied On October 4, 2019 06:46 AM UTC

Hi Luca, 

As per your request, we have added the solution in the separate js file. Kindly refer the below link for js file. 

Note: Refer the above js file after the ej.web.all.min.js reference. 

Regards, 
Manivannan Padmanaban. 


Pio Luca Valvona
Replied On October 16, 2019 09:05 AM UTC

Hi Luca, 

As per your request, we have added the solution in the separate js file. Kindly refer the below link for js file. 

Note: Refer the above js file after the ej.web.all.min.js reference. 

Regards, 
Manivannan Padmanaban. 


Hi Manivannan,
thank you for support,

Now everything works well.

Manivannan Padmanaban [Syncfusion]
Replied On October 16, 2019 10:25 AM UTC

Hi Luca, 

Thanks for the update. 

We are pleased to hear that the reported problem has been resolved. If you need further assistance, please get back to us. 

Regards, 
Manivannan Padmanaban. 


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