DatePicker format will not validate even

24 posts, 0 answers
  1. Jark Monster
    Jark Monster avatar
    46 posts
    Member since:
    Jan 2012

    Posted 27 Feb 2013 Link to this post

    I have a DatePicker that I want the desired input to be "Sun, 3/10/13"

    I've set up the DatePicker Format AND added the same format to the ParseFormats functions of "ddd, M/d/yyyy"

    The strange thing is that the desired input works, but the validation fires.

    For example.

    I type "3/10/2013" into the field and tab to the next input.  At this point, my input changes to "Sun, 3/10/13" (which is desired), BUT I get the "Field Date must be a date" validation error message.

    Do I need to define this format on the view model as well or is something else strange going on?

    Here's the source and an image of the issue is attached:

    @(Html.Kendo().DatePickerFor(m => m.PickupDate)
          .ParseFormats(new string[] {
               "ddd, M/d/yyyy",
               "ddd, MM/dd/yyyy",
               "ddd, M/dd/yyyy",
          })
          .Format("ddd, M/d/yyyy")
          .HtmlAttributes(new { style = "width:110px;" })
    )
    <span class="k-invalid-msg" data-for="PickupDate"></span>
  2. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3707 posts

    Posted 28 Feb 2013 Link to this post

    Hello Mark,

     
    I believe that the problem is related to jquery.validate and its inability to parse date string with "MMM, dd/MM/yyyy" format. I will suggest you check this blog post for more information and an approach how to handle this limitation.

    Greetings,
    Georgi Krustev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Peter
    Peter avatar
    5 posts
    Member since:
    Jul 2012

    Posted 26 Apr 2013 Link to this post


    <script src=
    "../../../Scripts/jquery.validate.js" type="text/javascript"></script>
    <script src="../../../Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>
      
      
    <script type="text/javascript">
      
        $(document).ready(function () {
      
            jQuery.validator.addMethod(
                'date',
                function (value, element, params) {
                    if (this.optional(element)) {
                        return true;
                    };
                    var result = false;
                    try
                                var date = kendo.parseDate(value, "dd.MM.yyyy");
                        result = true;
                                if(!date){
                                    result = false;
                                }
                    } catch (err) {
                        result = false;
                    }
                    return result;
                },
                ''
            );
        });
    </script>
  5. Michael
    Michael avatar
    43 posts
    Member since:
    Dec 2010

    Posted 30 Apr 2013 Link to this post

    I realize this seems to be a problem with jquery validation, but it gives the appearance that your DatePicker can't understand that an invalid date is not in a correct format.  Because of that, this is also your problem.  I went to that link you gave, and just thought, "You must be joking."  Manually setting up the globalization for jquery validation isn't something I thought I'd have to spend time on, but the exact steps to fix this should be well documented in your DatePicker documentation (maybe under Getting Started->Using Kendo With->Aspnet Mvc), as it is obviously something everybody that uses the DatePicker will encounter.  I've had to spend time searching around, and everybody seems to just point their finger at jquery validation.  I'd be glad to post a list of everybody asking about it, but don't want to go find them all again.  Please consider adding this info to your official documentation to save people time.  Thanks...
  6. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3707 posts

    Posted 02 May 2013 Link to this post

    Hello Michael,

     
    The jQuery Validate is a framework, which is not related to Kendo UI and we do not extend/change/modify. Hence, the one, which decides to use it, will need to overcome its limitations manually. Kendo Validator can be used instead of jQuery Validate.

    We defintely will point in our documentation how to handle such problems related to jQuery Validate framework. 

    All the best,
    Georgi Krustev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Michael
    Michael avatar
    43 posts
    Member since:
    Dec 2010

    Posted 02 May 2013 Link to this post

    I appreciate the professional response, but I have to disagree with your viewpoint.  That is like saying that if the Microsoft ASP.net AJAX framework is breaking your ASP.net AJAX controls, you won't bother trying to fix the problem because it's not your framework.  The jQuery Validation framework ships as part of the default ASP.net MVC templates, so the vast majority of all your MVC customers are going to use it.  It's not built by Microsoft, if that's what you mean, but that is irrelevant.  I'm not sure why you guys bothered to build your own validation framework, but that is probably a topic for another post.
  8. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 06 May 2013 Link to this post

    Hi Michael,

    As my colleague Georgi pointed out jquery.validate can't parse the "MMM, dd/MM/yyyy" format. This means that jquery.validate will fail with certain date formats with or without using Kendo UI DatePicker. Since patching open source libraries is beyond the scope of our product we can only suggest workarounds (such as the linked blog post) or using a library which we provide support for (Kendo UI Validator). This in fact was one of the main reasons we implemented our own validation library - to provide tight integration between all parts of the framework.

    Regards,
    Atanas Korchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  9. Michael
    Michael avatar
    43 posts
    Member since:
    Dec 2010

    Posted 06 May 2013 Link to this post

    My problem was slightly different than the original post, but similar.  I have resolved my issue for now.   I'd still rather see you extend the open source validation project, but I will watch yours as it progresses. Thanks for offering more information.
  10. Michiel
    Michiel avatar
    1 posts
    Member since:
    Jan 2013

    Posted 16 May 2013 Link to this post

    I have the same problem as Jark Monster even though I am not using his ParseFormats but a different one.

    My code looks like:
    <div class="control-group">
        @Html.LabelWithAsteriskFor(model => model.ValidTill)
        <div class="controls">
            @(Html.Kendo().DatePickerFor(model => model.ValidTill)
                    .Name("validTill")
                    .Format("dd-MM-yyyy")
                    .ParseFormats(new string[] {"ddMMyyyy"}))
        </div>
    </div>
    When I enter the date in format ddMMyyyy (e.g. 16052013) I see it getting corrected to "16-05-2013" but the error message (validTill is not a valid date) is displayed. I can still submit the form but I would not expect the error message in this case.
  11. ShareDocs
    ShareDocs avatar
    76 posts
    Member since:
    Oct 2012

    Posted 05 Aug 2013 Link to this post

    Hi,
    I have the same problem,
    I don't think blaming jquery is an answer because it is like saying microsoft mvc's Dll's are a problem.
    jquery becomes part of the mvc world and the mvc framework is using its abilities to allow the developer to set his mind in building apps and not doing workarounds .

    I don't mind using kendo.validaor but your demos and examples are too basic and seem really hard to assemble.

    hope you'll release a hotfix or some other reasonable solution 
  12. Johan
    Johan avatar
    2 posts
    Member since:
    May 2013

    Posted 14 Oct 2013 Link to this post

    I had the same problem.

    I have a DatePicker in my inline grid editing.
    The following solved it (I am in South Africa that's why ZA) 
    In my view I added the correct culture as below :

    @using CIS.UI.MVC.Models
    @using Kendo.Mvc.UI
    @model ConditionModel

    @{ 
    Culture = "en-ZA";
    }

    and in my grid
    columns.Bound(clause => clause.EffectiveDate).Format("{0:d}");

      "Field Date must be a date" validation error is now not popping up anymore

    Regards,
    Wilma
  13. mohamed
    mohamed avatar
    6 posts
    Member since:
    Apr 2014

    Posted 09 May 2014 in reply to Atanas Korchev Link to this post

    hi please help me please i am student 
    i have a probleme with datepicher() with kendo , some time it s woking some time no my probleme exactly is that  
    When I insert the date he only accepts date today, and n ' not accept another value, also if I want the date 09/05/2014 it gives me 09/05/2004, here is my code:  public Nullable<System.DateTime> DateD_envoie { get; set; }
                                             public Nullable<System.DateTime> DateReponse { get; set; }
     in my view i have this :
                       column.Bound(a => a.DateD_envoie).Format("{0:dd/MM/yyyy}").EditorTemplateName("Date");
                       column.Bound(a => a.DateReponse).Format("{0:dd/MM/yyyy}").EditorTemplateName("Date"); 
    in shared/EditorTemplates/Date i have this :
    @model DateTime?

    @(Html.Kendo().DatePickerFor(m => m).Format("dd/MM/yyyy"))                thank you


  14. Alev
    Alev avatar
    1 posts
    Member since:
    Jul 2014

    Posted 08 Aug 2014 Link to this post

    How can I set date fromat just for the MVC kendo grid  dd/MM/yyyy  both for dispay and edit without changing the global culture of the application
  15. Ruud
    Ruud avatar
    51 posts
    Member since:
    Oct 2012

    Posted 29 May 2015 Link to this post

    Hi all,

    Interesting topic... I am also struggling big time with this nightmare of dependent jQuery plugins, UI and Telerik controls, etc. I tried to implement the new Globalize.js plugin (which, on its turn, uses the cldr plugin for their content); I did not manage to get it to work. 

    Frustrated by the lack of any proper documentation for MVC4 and client side validations with different locals (seem pretty basic if you read it like this..) I now will try to implement the Kendo validators. 

    Meanwhile, if someone has some proper tutorials and or sample project for using the jQuery validation and Globalize.js plugin, please post it here.. 

    Regards,

    Ruud

  16. Ruud
    Ruud avatar
    51 posts
    Member since:
    Oct 2012

    Posted 22 Jul 2015 in reply to Ruud Link to this post

    Anyone has an update on this? I had a really ugly work around by setting the format hardcoded as part of the Kendo date picker. But it is getting embarrassing now to tell my customer it cannot be done without heavy re work.
  17. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3707 posts

    Posted 24 Jul 2015 Link to this post

    Hello Ruud,

    I would suggest you review our Validation help topic, which provides a detailed information how to validate model fields in the Grid and also how to troubleshoot / workaround some of the jQuery Validate limitations (it cannot validate internalized dates): You can use Globalize.js parseDate instead of kendo.parseDate if it is the desired way to go.

    Regards,
    Georgi Krustev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  18. Ruud
    Ruud avatar
    51 posts
    Member since:
    Oct 2012

    Posted 29 Jul 2015 in reply to Georgi Krustev Link to this post

    Hi Georgi,

    Thanks for your reply. I did use this technique of making my own overrides for the $.validator.methods.date functions. 

    The issue was that the appropriate globalization files were not updated any more after a UI language change by the user. This has to do with the script bundling; I construct the correct Url to the globalization files by combing the selected UI language and the path in the bundle configuration class. This will work when the user logs in, but not if he changes the languages during the session. 

    So I moved the links back to the layout view, now it works again. I tried a little bit too much cleanup i guess..

  19. Urvish
    Urvish avatar
    1 posts
    Member since:
    Sep 2015

    Posted 28 Sep 2015 Link to this post

    datepicker not working i.e. date is not accepting dd/MM/yyyy format
    eg. model is accepting the MM/dd/yyyy format whereas i want the data to be written in dd/MM/yyyy format. i have tried culture and format both on my model as well as editor template side but still no effect. What shall be done now?

    Here is my code
    model:
    [UIHint("Date")]
            [DataType(DataType.Date)]
            [DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}", ApplyFormatInEditMode = true)]
            public DateTime? WarrantyEndDate { get; set; }

    datetime editor template:
    @model DateTime?
    @(Html.Kendo().DatePickerFor(m => m).Format("dd/MM/yyyy"))

    I am still getting date in the same MM/dd/yyyy format which in turn is giving me 'must be a date' validation. please help me in this.
  20. Ruud
    Ruud avatar
    51 posts
    Member since:
    Oct 2012

    Posted 28 Sep 2015 in reply to Georgi Krustev Link to this post

    Hi Georgi,

    Thanks for your reply. I did of course study this guide; it is just quite a puzzle to get it in a standards MVC project up and running. Lots of script to include, lots of extra work arounds etc. It takes up quite some time; so I hoped some MVC application would be out there to demonstrate how to handle this. But I guess I will have to do some thinking myself :).

    Meanwhile FYI for anyone using JayData; I did run into an issue not Telerik specific; I use the JayData client side framework as my data provider; this component seems to always use the en-US locale. Which makes sense. But, Telerik controls of course will work with the selected locale, which can be an issue if you try to display and edit values directly via JayData. It seems to be an issue with numeric (decimal) values only; dates are working fine. For now, I just set the Telerik controls configuration to "en-US" and that works (you do have to instruct your users to use the . as a decimal seperator). The "asKendoDataSource" method does not solve this as well btw. 

    Regards,

    Ruud

  21. fernando ramirez
    fernando ramirez avatar
    3 posts
    Member since:
    Oct 2003

    Posted 30 Nov 2015 in reply to Urvish Link to this post

    Did you solve this issue? If so do you mind sharing your solution...

    Facing the same problem

    Regards

  22. Ron
    Ron avatar
    2 posts
    Member since:
    Sep 2015

    Posted 28 Apr in reply to fernando ramirez Link to this post

    Is it just me who thinks that this is a complete nonsense.

    Surely a plugin should just work.

    Telerik is an expensive product and the amount of work to get it to do anything other than look pretty in a contrived simple example is a complete joke.

    I am having issues with this stil on release 2016 Q1

     

  23. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2566 posts

    Posted 02 May Link to this post

    Hello Ron,

    As I already asked in another thread - can you please elaborate a bit more what is the issue that you are facing and what you are trying to do, so we can further assist you?

    Thanks for the help!

    Regards,
    Kiril Nikolov
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  24. Graham
    Graham avatar
    4 posts
    Member since:
    May 2016

    Posted 16 Sep Link to this post

    This is a big issue that doesn't seem to be getting resolved. I have lost a day trying to get what is a simple date picker to work. Whenever I use the kendo version I just get blocked by this validation problem. I have tried all of the formatting and the culture variations:

     

        @Html.Kendo().DatePickerFor(model => model.Added)

          .Format("dd/MM/yyyy").ParseFormats(new List<string>()
                        {
                        "dd/MM/yyyy",
                        "dd/MM/yy",
                        "dd MMM yyyy"
                        })

     

    but it just comes back with validation errors. Once again I find myself ripping out the Telerik solution for a much simpler and working solution from either jquery ui or hand rolled. What should be a simple implementation is, like so many other of their controls, difficult to work with.

  25. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2566 posts

    Posted 17 Sep Link to this post

    Hi Graham,

    Can you please open a separate support request with a sample attached and we will be happy to help.

    Regards,
    Kiril Nikolov
    Telerik by Progress
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET MVC is VS 2017 Ready