Автозаполнение текстового поля с использованием Durandal JS

Question

Как создать текстовое поле автозаполнения с использованием durandal JS. Данный код не работает.

ViewModel (JS)

define(['repositories/customerRepository', 'plugins/router', 'plugins/http', 'durandal/app', 'knockout'], function (customerRepository, router, http, app, ko) 
{ 
return { 
    router: router, 

    activate: function() { 

     var data = customerRepository.listMovies(); 

     $(function() { 
     $("#movie").autocomplete({ 
      source: data, 

      focus: function (event, ui) { 
       $("#movie").val(ui.item.name); 
       return false; 
      }, 
      select: function (event, ui) { 
       $("#movie").val(ui.item.name); 
       // $("#friend-id").val(ui.item.id); 
       return false; 
      } 
     }) 

       .data("ui-autocomplete")._renderItem = function (ul, item) { 

        return $("<li>") 
         .append(
         "<a>" + "<table><tr><td rowspan=2>" + item.name + "</td></tr><tr><td>" + item.barcode + "</td></tr></table>") 
          .appendTo(ul); 

       }; 
     }); 

    }, 




}; 

});

вид (HTML)

<input id="movie" type="search" class="form-control" data-bind="value: searchModel.searchTerm" placeholder="Name/Bar code"> 

Answer 1

Хорошая отправная точкой будет удалить вашу логику от активации и добавить его к прикрепленному методу (если вы используете Дюрандальте 2.0) Если вы не добавили бы это для просмотраAttached. Это срабатывает, когда DOM готов, поэтому вам не нужно обертывать его в $ (function() {});

Дайте попробовать и проверьте, правильно ли привязан ваш jquery ui auto complete.

Я лично предпочитаю использовать Select2, а затем создать для него обязательную привязку ko.

Надеюсь, что это поможет вам в правильном направлении!

Answer 2

Durandal является основой JavaScript предназначен для обработки много вещей, но это главная цель не создавать элементы пользовательского интерфейса.

С помощью Durandal вы можете использовать Knockout для создания декларативных двусторонних привязок данных, которые могут обеспечивать элементы управления, такие как текстовое поле автозаполнения. Лучше всего будет исследовать, как создавать текстовые поля AutoComplete или выпадающие меню с помощью Knockout.

Google предоставляет множество результатов по этому вопросу

'autocomplete textbox knockout'