JavaScript runtime error:" Unable to get property 'call' of undefined or null reference" in jquery.validate.js

1

Included libraries

@Scripts.Render("~/Scripts/jquery-ui-1.11.4.min.js")
@Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
@Scripts.Render("~/Scripts/jquery.validate.js")

My validation only activates when a button Add is clicked:

$('#form1').validate({
        rules: {
            PROGRAM: {
                required: true,
                maxlength:20
            },
            UNIT:"required",
            IS_ACTIVE:"required"
        },
        messages: {
            PROGRAM: {
                required: "Program Code is required.",
                maxlength: "Program code cannot be over 20 characters long"
            },
            UNIT: {
                required: "Unit code is required. Please select one."
            },
            IS_ACTIVE:{
                required:"Is it active?"
            }
        },
        errorElement: 'div',
        errorLabelContainer: 'validationErrDisplay'
    });
   $('#programUnitInquiry').validate().cancelSubmit = false;

The above code, as well as event handlers (including the one for Add button) are wrapped into $(document).ready().

In form1, PROGRAM is a textbox, the rest are dropdown lists. When I clicked on the UNIT dropdown list, a runtime error is thrown. Error comes from line 1234 in the /Scripts/jquery.validate.js file, version 1.10.0:

if (!jQuery.event.special.focusin && !jQuery.event.special.focusout && document.addEventListener) {
        $.each({
            focus: 'focusin',
            blur: 'focusout'
        }, function( original, fix ){
            $.event.special[fix] = {
                setup:function() {
                    this.addEventListener( original, handler, true );
                },
                teardown:function() {
                    this.removeEventListener( original, handler, true );
                },
                handler: function(e) {
                    var args = arguments;
                    args[0] = $.event.fix(e);
                    args[0].type = fix;
                    return $.event.handle.apply(this, args);
                }
            };
            function handler(e) {
                e = $.event.fix(e);
                e.type = fix;
                return $.event.handle.call(this, e); // <-- error
            }
        });
    }

Error message:

0x800a138f - JavaScript runtime error: Unable to get property 'call' of undefined or null reference

UNIT dropdown list's HTML after it's rendered:

<select name="UNIT" id="UNIT" data-val-required="The Unit Code field is required." data-val="true">
<option value="">-- Select a Unit --</option>
<!-- bunch of options retrieved from database -->
</select>
jquery
formvalidation-plugin
asked on Stack Overflow Jul 13, 2016 by Dylan Czenski • edited Feb 6, 2019 by marc_s

0 Answers

Nobody has answered this question yet.


User contributions licensed under CC BY-SA 3.0