How to make the jQuery valid function work reliably on IE?

I have a problem on jQuery valid function. When on IE, it doesn't work, the valid always return true. I used this code: client side validation with dynamically added field

Here's the chart:

                    Chrome      IE

jquery-1.6.1        works       not working
jquery-1.4.4        works       works

1.6 doesn't work on IE too. However, 1.4.4 jQuery valid works on IE.

Here's the jsFiddle-friendly test (test this as local html):

<!--
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> -->

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8/jquery.validate.min.js" type="text/javascript"></script>

<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>



<form id="XXX">
    <input type="submit" id="Save" value="Save">

</form>


<script type="text/javascript">

    // sourced from http://stackoverflow.com/questions/5965470/client-side-validation-with-dynamically-added-field
    // which I do think don't have a bug
    (function ($) {


        $.validator.unobtrusive.parseDynamicContent = function (selector) {
            //use the normal unobstrusive.parse method
            $.validator.unobtrusive.parse(selector);

            //get the relevant form
            var form = $(selector).first().closest('form');

            //get the collections of unobstrusive validators, and jquery validators
            //and compare the two
            var unobtrusiveValidation = form.data('unobtrusiveValidation');
            var validator = form.validate();

            $.each(unobtrusiveValidation.options.rules, function (elname, elrules) {
                if (validator.settings.rules[elname] == undefined) {
                    var args = {};
                    $.extend(args, elrules);
                    args.messages = unobtrusiveValidation.options.messages[elname];
                    $('[name=' + elname + ']').rules("add", args);
                } else {
                    $.each(elrules, function (rulename, data) {
                        if (validator.settings.rules[elname][rulename] == undefined) {
                            var args = {};
                            args[rulename] = data;
                            args.messages = unobtrusiveValidation.options.messages[elname][rulename];
                            $('[name=' + elname + ']').rules("add", args);
                        }
                    });
                }
            });
        }
    })($);
    // ...sourced from others


    // my code starts here...
    $(function () {

        var html = "<input data-val='true' " +
           "data-val-required='This field is required' " + "name='inputFieldName' id='inputFieldId' type='text'/>";
        $("form").append(html);

        var scope = $('#XXX');

        $.validator.unobtrusive.parseDynamicContent(scope);




        $('#Save').click(function (e) {
            e.preventDefault();
            alert(scope.valid());
        });

    });
    // ...my code ends here

</script>

UPDATE

I tried my code on jsFiddle, it has side-effect, the jQuery 1.6's valid is working on IE. Don't test this code on jsFiddle. Test this code on your local html

Answers


This problem has been solved. try version 1.8.1.

Download jQuery validation plugin


Need Your Help

Java: Getting Bytecode of Class at Runtime from within the Same JVM

java clojure persistence bytecode java-bytecode-asm

Related to: Java: Is there a way to obtain the bytecode for a class at runtime?

Change String “@patient” to variable

ruby-on-rails ruby ruby-on-rails-3 ruby-on-rails-4

How can i use strings as varibles in ruby and assign values to it for eg: