Announcement

Collapse
No announcement yet.

[CLOSED] jquery_validation_unobtrusive example?

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

    [CLOSED] jquery_validation_unobtrusive example?

    Hey there,

    I'm trying to use bridge.net and retyped to create custom client side validators for my asp project.
    The normal way of doing it would be to create a jquery script for an iclientmodelvalidator as described here: https://stackoverflow.com/questions/...modelvalidator -

    However, I do not want to write custom javascript, and it would be nicer if it would be generated based on models and attributes.

    So, here is an example of how to add https://johnnyreilly.github.io/jQuer...tml#javascript

    So, in my project I added retyped.jquery-validation-unobtrusive. Now I'm looking for an addMethod action somewhere, which I think should be in the jquery_validation_unobtrusive.JQueryValidation namespace or jquery_validation_unobtrusive.MicrosoftJQueryUnobt rusiveValidation namespace, however I cannot really figure out how to invoke it.

    Any help is appreciated

    #2
    Hi RonSijm ,

    Thanks for your interest in Bridge.NET and Retyped.

    The reason why you didn't manage to find the required methods is that they are declared like augmentation for the original jquery entities. Or more precisely, jquery-validation-unobtrusive augments some entities declared in jquery-validation, and jquery-validation in its turn augments some interfaces of jquery library.

    Currently Retyped does not provide required mappings out of the box, but we are working on that. So you may expect that process to be automated soon. As a workaround you can create an extension class like it's shown below. I checked your sample, works perfect for me. Don't forget to add javascript libraries for both: jquery-validation-unobtrusive and jquery-validation, e.g.:
    <script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validation-unobtrusive/3.2.6/jquery.validate.unobtrusive.js"></script>
    the sample C# code:
    public class App
    {
        public static void Main()
        {
            jQuery.Validation().validator.addMethod("notequalto", (value, element, parameters) =>
            {
                return value != jQuery.select(parameters["other"]).val();
            }, "These shouldn't equal");
    
            jQuery.select("form").Validation().validate();
        }
    }
    
    /// <summary>
    /// Mappings for jquery validation/validation-unobtrusive.
    /// </summary>
    [External]
    public static class ValidationExtensions
    {
        /// <summary>
        /// Gets jquery.JQuery extensions declared in "jquery_validation".
        /// </summary>
        [Template("{0}")]
        public static extern jquery_validation.JQuery Validation(this jquery.JQuery.Interface jquery);
    
        /// <summary>
        /// Gets jquery.JQueryStatic extensions declared in "jquery_validation".
        /// </summary>
        [Template("{0}")]
        public static extern jquery_validation.JQueryStatic Validation(this JQueryStatic.Interface jquery);
    
        /// <summary>
        /// Gets jquery_validation.ValidatorStatic extensions declared in "jquery_validation_unobtrusive".
        /// </summary>
        [Template("{0}")]
        public static extern jquery_validation_unobtrusive.JQueryValidation.ValidatorStatic Unobtrusive(this jquery_validation.JQueryValidation.ValidatorStatic validator);
    }
    Hope this helps.

    Comment


      #3
      Hi RonSijm,

      Just want to post a quick update to the thread.
      Retyped now detects and declares extensions automatically, see more information here. So the sample above could be reduced to the following:

      public class App
      {
          public static void Main()
          {
              jQuery.jquery_validation().validator.addMethod("notequalto", (value, element, parameters) =>
              {
                  return value != jQuery.select(parameters["other"]).val();
              }, "These shouldn't equal");
      
              jQuery.select("form").jquery_validation().validate();
          }
      }

      Comment

      Working...
      X