CODEWITHSUNDEEP
jqueryjquery-ui
Oliver I
Oliver I

Reputation: 456

jQuery UI not loading

My test div is below. If I put all of this into its own page, everything works perfectly. If it put it onto my final page, I get an error saying that datepicker() is undefined.

How do I figure out what is causing jQuery UI to break?

<div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>

<link type="text/css" href="../css/ui-lightness/jquery-ui-1.8.18.custom.css" rel="stylesheet" />

<script type='text/javascript'>
$(document).ready(function() {

    //for calendar
    $("#date_to").datepicker();
    $("#date_from").datepicker();
    //end for calendar
})
</script>

<input id='date_to'>
<input id='date_from'>
</div>

Upvotes: 8

Views: 14975

Answers (2)

JoshNaro
JoshNaro

Reputation: 2097

Make sure you didn't accidentally reference jQuery twice. I had an older version of jQuery loading after jQuery UI, which was jacking things up. =/

Upvotes: 20

Leonardo Barbosa
Leonardo Barbosa

Reputation: 1396

Be sure that when you generate your jQuery UI package here: http://jqueryui.com/download, you select the element Datepicker. I saw that you are using the version hosted by Google, it works fine here, they provide it: jQuery UI Datepicker 1.8.18 (look at the source code). To figure out what is causing jQueryUI to break, besides debugging:

  • Test at jsfiddle.net;
  • Test in other local enviroment (other browsers as well);

Hope it helps.

Upvotes: 0

Related Questions