zoukankan      html  css  js  c++  java
  • jquery.validate.unobtrusive not working with dynamic injected elements

    jquery.validate.unobtrusive not working with dynamic injected elements

    I am working with ASP.Net MVC3, the easier way to use the client validation would be enabling the jquery.validate.unobtrusive. Everything works fine, for stuff that's right from server.

    But when I try to inject some new 'inputs' with javascript, and I knew that I need to call $.validator.unobtrusive.parse() to rebind the validations. But still, all those dynamic injected fields are not functioning.

    Even worse, I try to manually bind using jquery.validate and it is not working either. Any thoughts?

    回答1

    I've created an extension for the jquery.validate.unobtrusive library that solved this problem for my situation - it might be of interest.

    http://xhalent.wordpress.com/2011/01/24/applying-unobtrusive-validation-to-dynamic-content/

    回答2

    I tried Xhalent's approach but unfortunately it wasn't working for me. Robin's approach did work and didn't work. It worked great for dynamically added elements, but if you tried to use JQuery to remove all the validation attributes and spans from the DOM, the validation library still would try to validate them.

    However, if you remove the form's "unobtrusiveValidation" data in addition to "validationData", it worked like a charm for dynamically adding and removing elements that you want validated or not validated.

    $("form").removeData("validator");
    $("form").removeData("unobtrusiveValidation");
    $.validator.unobtrusive.parse("form");
    

    回答3

    I actually really like the simplicity of @viggity and @Robins solution, so I turned it into a quick little plugin:

    (function ($) {
    
        $.fn.updateValidation = function () {
            var $this = $(this);
            var form = $this.closest("form")
                .removeData("validator")
                .removeData("unobtrusiveValidation");
    
            $.validator.unobtrusive.parse(form);
    
            return $this;
        };
    })(jQuery);
    

    Example usage:

    $("#DischargeOutcomeNumberOfVisits")
        .attr("data-val-range-min", this.checked ? "1" : "2")
        .updateValidation();
    
  • 相关阅读:
    eos合约案例导读
    eos TODO EOS区块链上EOSJS和scatter开发dApp
    电脑提示‘您需要来自Administration的权限才能对此文件夹进行更改’怎么删除文件
    ubuntu 设置全局代理
    eos开发实践
    eos博客
    如何在Ubuntu 18.04上安装Go
    parity密码
    Nodejs基础之redis
    完全搞懂事件
  • 原文地址:https://www.cnblogs.com/chucklu/p/14246420.html
Copyright © 2011-2022 走看看