JQuery: TypeError: Object [объект Object] не имеет никакого метода '' Datepicker

Question

load.js:

jQuery(document).ready(function($) { 
    $('.dialog ul li').click(function(e) { 
     switch($(this).attr('id')) { 
     case 'addProject': 
      $('.addDialog').load('/add/addprojectform'); 
      break; 
     case 'addTask': 
      $('.addDialog').load('/add/addtaskform'); 
      $('#dueDate').datePicker(); 
      break; 
     } 
    }); 
}); 

И это в заголовке:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script> 
<script type="text/javascript"> 
$.noConflict(); 
</script> 
<script src="js/utils.js"></script> 
<script src="js/load.js"></script> 

Я получаю ошибку является:

Uncaught TypeError: Object [object Object] has no method 'datePicker' load.js:10 
(anonymous function) load.js:10 
f.event.dispatch jquery.min.js:3 
f.event.add.h.handle.i jquery.min.js:3 

Я пробовал несколько способов исправить это, но все же ошибка есть. Что вызывает ошибку? Спасибо

Answer 1

Поскольку load выполняет асинхронный вызов Ajax и элемент #duedate внутри ресурса, вы должны ждать окончания вызова перед использованием метода применительно к этому элементу

Поскольку любой АЯКС метод на JQuery возвращает Отложенный Объект вы можете продолжить выполнение кода внутри done() обратного вызова

$('.addDialog').load('/add/addtaskform').done(function() { 
    $('#dueDate').datePicker(); 
}); 

или с помощью простого успеха обратного вызова

$('.addDialog').load('/add/addtaskform', function() { 
    $('#dueDate').datePicker(); 
});