Uncaught TypeError: Cannot read property 'addMethod' of undefined

Question

jQuery(document).ready(function () {
    //alert("HIQ");
    $('.mySelectCalendar').datepicker({ firstDay: 1, dateFormat: "dd.mm.yy" });
    $.validator.addMethod(
            'date',
            function (value, element, params) {
                if (this.optional(element)) {
                    return true;
                };
                var result = false;
                try {
                    $.datepicker.parseDate('dd.mm.yy', value);
                    result = true;
                } catch (err) {
                    result = false;
                }
                return result;
            },
            ''
        );
});

I get error as "Uncaught TypeError: Cannot read property 'addMethod' of undefined"

_layout as this

@ViewBag.Title

<!-- jQuery -->
<script src="~/App_Themes/ThemeBlue/assets/js/jquery203.js"></script>
<script src="~/App_Themes/ThemeBlue/assets/js/jquery.min.js"></script>

<script type="text/javascript">
    var jQuery_2_0_3 = $.noConflict(true);
</script>
<!-- Picker UI-->
<script src="~/App_Themes/ThemeBlue/assets/js/jquery-ui.js"></script>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>


<!--Validation  -->
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery.validate.js"></script> 
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>

<link href="~/App_Themes/ThemeBlue/css/validation.css" rel="stylesheet" />
<script type="text/javascript">
    var jQuery_1_7_0 = $.noConflict(true);
</script>
<!-- Bootstrap -->
<link href="~/App_Themes/ThemeBlue/dist/css/bootstrap.css" rel="stylesheet" media="screen" />
<link href="~/App_Themes/ThemeBlue/assets/css/custom.css" rel="stylesheet" media="screen" />


<!-- bin/jquery.slider.min.js -->


<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/jshashtable-2.1_src.js"></script>
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/jquery.numberformatter-1.2.3.js"></script>
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/tmpl.js"></script>
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/jquery.dependClass-0.1.js"></script>
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/draggable-0.1.js"></script>
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/jquery.slider.js"></script>
<!-- Javascript  -->
<script src="~/App_Themes/ThemeBlue/assets/js/initialize-loginpage.js"></script>
<script src="~/App_Themes/ThemeBlue/assets/js/jquery.easing.js"></script>
<script src="~/App_Themes/ThemeBlue/assets/js/customTravel.js"></script>
<!-- Load Animo -->
<script src="~/App_Themes/ThemeBlue/plugins/animo/animo.js"></script>
<script src="~/App_Themes/ThemeBlue/dist/js/bootstrap.min.js"></script>

<!-- Carousel -->
<link href="~/App_Themes/ThemeBlue/examples/carousel/carousel.css" rel="stylesheet" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
      <script src="assets/js/html5shiv.js"></script>
      <script src="assets/js/respond.min.js"></script>
    <![endif]-->

<!-- Fonts -->
<link href='http://fonts.googleapis.com/css?family=Lato:400,100,100italic,300,300italic,400italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:700,400,300,300italic' rel='stylesheet' type='text/css'>
<!-- Font-Awesome -->
<link rel="stylesheet" type="text/css" href="~/App_Themes/ThemeBlue/assets/css/font-awesome.css" media="screen" />
<!--[if lt IE 7]><link rel="stylesheet" type="text/css" href="~/App_Themes/ThemeBlue/assets/css/font-awesome-ie7.css" media="screen" /><![endif]-->

<!-- REVOLUTION BANNER CSS SETTINGS -->
<link rel="stylesheet" type="text/css" href="~/App_Themes/ThemeBlue/css/fullwidth.css" media="screen" />
<link rel="stylesheet" type="text/css" href="~/App_Themes/ThemeBlue/rs-plugin/css/settings2.css" media="screen" />

<!-- Picker UI-->
<link rel="stylesheet" href="~/App_Themes/ThemeBlue/assets/css/jquery-ui.css" />

<!-- bin/jquery.slider.min.css -->
<link rel="stylesheet" href="~/App_Themes/ThemeBlue/plugins/jslider/css/jslider.css" type="text/css">
<link rel="stylesheet" href="~/App_Themes/ThemeBlue/plugins/jslider/css/jslider.round.css" type="text/css">



<!-- Animo css-->
<link href="~/App_Themes/ThemeBlue/plugins/animo/animate_animo.css" rel="stylesheet" media="screen">
<!-- end -->

I write web application in MVC and could not solve this problem.

COuld you help me?

Answer 1

for me it was fixed when i put $.validator.addMethod method out of $(document).ready(function(){ !
and there was no need to use noConflict() method...
if you use Webpack(or Laravel mix like me) check the order of compiled js which sometimes it put validator before jquery and that causes this error