“自动完成不是功能” Javascript错误

在我的Grails项目（2.2.1版）中，我在两个不同的GSP页面中使用以下Javascript代码。

<g:javascript>
$(document).ready(function() {
    $.ajax({
        type: "GET",
        url: "/medicalOfficeManager/Patient/getAllPatients",
        dataType: "json",
        success : function(response) {
            //Create a map.
            var data =
                    $.map(response, function(item){
                        console.log("id: " + item.id);
                        console.log("name: " + item.surname + " "+ item.name);
                        return{
                            id: item.id,
                            value: item.surname + " " + item.name
                        }
                    });


            $("#patient_textField").autocomplete({
                source: data,
                select: function (event, ui){
                    console.log("selected id:" + ui.item.id);
                    console.log("selected name:" + ui.item.value);

                    //when a country is selected(ie: type China and press enter),
                    //change the value of hidden field to the country's id.
                    $('#patient_id').val(ui.item.id);
                    console.log("patient value = "+ $('#patient_id').val());
                }
            });

        }
    });

});
</g:javascript>

在一个GSP中，一切正常，在另一个中，查看Javascript控制台，出现以下错误：

$（...）。autocomplete不是函数

我已阅读了此讨论，但对我而言不起作用。

有什么建议吗？

编辑：我注意到，页面之间的唯一区别是，在不工作的页面中，它加载了bundle-bundle_core_head.js，但是我看不到它在gsp页面中的加载位置...

EDIT2：在其他gsp中加载了一个组件，其中包括早期版本的JQuery和JQuery UI，但是我需要该组件，因为如果我对其进行注释，则另一个允许我选择日期和时间的字段将不起作用。可以同时使用两者吗？