jQuery error in MVC project: Datepicker is not a function

Question

This is what is in my view:

@Html.TextBox("toDateFilter", "", new { @class = "datepicker" })
...etc
...etc


<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

<script>
    $(document).ready(function () {
        $(".datepicker").datepicker();
    });
</script>

I am getting the error:

Datepicker is not a function.

I have followed the advice of all the other similar questions, and nothing has worked. I also changed the View to these imports instead:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/ui-lightness/jquery-ui.min.css" />

I also tried this instead:

var $j = jQuery.noConflict();
$j("#datepicker").datepicker();

Also I did check that the jquery-ui.min.js file loaded correctly.

Any ideas why this is going wrong? Let me know if I can supply more info...

Suggests to me that your .ready() is running before the jquery-ui.min script has loaded. Can you put a breakpoint on that line and see if the external script has loaded at point? — Starscream1984
– Starscream1984, Commented Nov 17, 2015 at 16:19
Your code should work fine. I just copied and pasted it from your question and it worked fine for me. — Shyju
– Shyju, Commented Nov 17, 2015 at 16:20
@AlanSchapira - at what point in the code does it run that test? — Starscream1984
– Starscream1984, Commented Nov 17, 2015 at 16:36
I would make sure external scripts are in the <head> and also maybe look into having the scripts load from your own domain, rather than CDN. It should then be safe to expect that ready() will run when all dependencies have loaded — Starscream1984
– Starscream1984, Commented Nov 17, 2015 at 16:51

CodeNotFound · Accepted Answer · 2017-07-17 20:14:44Z

6

Datepicker is not a function. i am also facing this issue.i have resolved it using Jquery Noconflict function.

$.noConflict();
jQuery(document).ready(function ($) {
    $(function () {
        $('.datefield').datepicker();
    });
});

edited Jul 17, 2017 at 20:14

CodeNotFound

23.4k10 gold badges75 silver badges73 bronze badges

answered Jul 17, 2017 at 16:09

krishan

611 silver badge2 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Alan Schapira · Accepted Answer · 2015-11-17 17:45:37Z

1

This is the answer from Starscream1984 in the comments, so props to them!

The issue is that the ready() function was being called before the jquery-ui.js script had finished loading.

This could not be fixed by moving it into the <head> nor loading the scripts from my own domain.

I was able to fix it simply by removing the ready() function entirely, and just running the contents.

If anyone knows how I can force the script to load first, or the ready() function to be called last, please let me know.

edited Nov 17, 2015 at 17:45

answered Nov 17, 2015 at 17:37

Alan Schapira

1,1735 gold badges17 silver badges34 bronze badges

Comments

Giorgos Kritsotakis · Accepted Answer · 2015-11-17 16:18:11Z

0

Have you tried doing something like this:

$(function () {
    $("#nameOfTheFieldInModel").datepicker({
        dateFormat: 'dd-mm-yy',
        changeMonth: true,
        changeYear: true
    });
});

In document ready?

answered Nov 17, 2015 at 16:18

Giorgos Kritsotakis

191 silver badge6 bronze badges

2 Comments

Starscream1984 Over a year ago

If datepicker() is not a function, it doesn't matter what you try to pass in to it.

Giorgos Kritsotakis Over a year ago

@AlanSchapira you could try moving the jquery inclusion in the Site.Master

Collectives™ on Stack Overflow

jQuery error in MVC project: Datepicker is not a function

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related