2017-01-14 3 views
1

Я думаю о том, чтобы поместить функцию автозаполнения для одного из полей ввода в представлении Asp.net, поэтому я опробовал пример из JQuery UI и вставил код внутри одного из .cshtml просмотров:JQuery UI autocomplete не работает в MVC View

<html> 
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
var data = ["Boston Celtics", "Chicago Bulls", "Miami Heat", "Orlando Magic", "Atlanta Hawks"]; 
$("#seed_one").autocomplete({source:data}); 
}); 
</script> 
</head> 

<body> 
<input id="seed_one" type="text" name="seed_one" /> 
</body> 
</html> 

Однако, когда я запускаю приложение и начинаю вводить что-то в поле ввода, никаких предложений не появляется. В чем проблема с кодом?

+1

Проверьте свою консоль браузера, чтобы увидеть, что у вас есть ошибки скрипта. Ваш код работает отлично http://jsbin.com/livajenuco/edit?html,js,output – Shyju

+0

этот код работает отлично https://jsfiddle.net/ajays871/j6p0ogjt/ – user3775217

+0

положил сценарий 'document.ready' в конце вашего тега 'body' – sweaver2112

ответ

0

Я бы порекомендовал вам скачать jQuery и jQuery UI вместо использования своего CDN. Проблема с использованием последней версии jQuery заключается в том, что вы никогда не знаете, какая версия она или совместима с текущей версией jQuery UI.

Используя последний URL-адрес версии jQuery, его версия будет время от времени изменяться, иногда нарушая изменения или генерируя несовместимость с внешними библиотеками (такими как пользовательский интерфейс jQuery).

Кроме того, здесь рабочая скрипка для автозаполнения: https://jsfiddle.net/zymh9xk9/

$(document).ready(function(){ 
    var data = ["Boston Celtics", "Chicago Bulls", "Miami Heat", "Orlando Magic", "Atlanta Hawks"]; 
    $("#seed_one").autocomplete({source:data}); 
}); 

Скачать последнюю версию производства (стабильная) версию JQuery здесь: https://jquery.com/download/

Как JQuery UI: https://jqueryui.com/download/

+0

Я все еще получаю ошибку, говоря, что автозаполнение не является функцией в HTMLDocument. . Вот скриншот ошибки, сделанной в Chrome: [link] (http://prntscr.com/dvlwhm) –

+0

Вы вызываете пользовательский интерфейс jQuery сразу после самого jQuery? Эта ошибка возникает только тогда, когда пользовательский интерфейс jQuery не загружается. Вы можете проверить свою страницу и проверить, загружены ли ваши файлы на вкладке «Элемент» (если вы используете Google Chrome). – Anna

+0

Посмотрел вкладку Элемент. Кажется, что JQuery загружен, но пользовательский интерфейс JQuery - нет. Зачем? Я установил JQuery Ui через Bower и связал его сразу после связывания JQuery следующим образом: Вот скриншот Элемента tab: [link] (http://prntscr.com/dvlz9w) –

Смежные вопросы