2015-09-02 2 views
2

Я использую knockout.js с jquery. availableBrands определяется как:selectize not working with dynamic knockout options binding

self.availableBrands = ko.observableArray(); 

мой АЯКС метод запроса:

self.loadBrands = function() { 
       $.ajax({ 
        url: '/api/Electronic/GetBrands', 
        dataType: "json", 
        contentType: "application/json", 
        cache: false, 
        type: 'POST', 
        success: function (data) { 
         $.each(data,function (i,item) { self.availableBrands.push(item) }); 
        }, 
        error: function (jqXHR, status, thrownError) { 
         toastr.error("failed to load Brands.Please refresh page and try again", "Error"); 
        } 
       }); 
      } 

и данные, которые я получать это:

enter image description here

Update: Я использую Нокаут опции с плагином selectize как:

<select id="select-category" class="demo-default" data-bind="options: availableBrands, 
         value: selectedBrand, 
         optionsCaption: 'Choose brand...'"></select> 

и JS является:

$('#select-category').selectize({ 
       create: true, 
       sortField: { 
        field: 'text', 
        direction: 'asc' 
       }, 
      }); 

Теперь выберите показывает только те варианты, которые я жестко вписаны. Он не показывает параметры, загруженные через ajax.

Update 2:

В loadBrands функции я пишу self.availableBrands.push('ghi'); и ghi показан в некоторых вариантах. Но данные, загруженные через ajax, не показаны.

Я изменил АЯКС успех:

success: function (data) { 
         $.each((data), function (i, item) { console.log(item); }); 
        }, 

и данные на консоли показано на рисунке

enter image description here

Почему данные, загруженные через AJAX не показано выбрать?

+0

Просто используйте '$ .each ($ (данные), функция()' Преобразование данных в 'jquery' объект –

+0

вы можете напрямую назначить, чем скорее толкая чек здесь Http:. // jsfiddle .net/LkqTU/26469 /. надеется, что помогает –

+0

Ошибки регистрируются? – guest271314

ответ

1

Должно работать должным образом, убедитесь, что вы правильно указали jquery.

ViewModel:

var ViewModel = function (data) { 
    var self = this; 
    self.list = ko.observableArray(); 
    $.each(data, function (i,item) { 
     self.list.push(item) 
    }); 
} 
ko.applyBindings(new ViewModel([11, 22, 33])); 

выборочная проверка here для справки

Там нет необходимости использовать $.each в вашем этом случае нужно проверить here.

Обновление с использованием Selectize Проверка плагина here.

Попробуйте применить .selectize в случае успеха ajax после загрузки параметров.

+1

да, это может случиться и в этом случае. Поэтому попробуйте применить' .selectize' в ajax success и пытаться . он будет применяться только после загрузки опций –

0

данные не являются объектом jQuery. Вы можете просто использовать обычный Javascript forEach заявление

data.forEach(function(item){ self.availableBrands.push(item)}) 

также self не может быть правильно установлен в функции обратного вызова.Вы можете сделать следующее

self.loadBrands = function() { 
    var self=self; 
    $.ajax({ 
+0

. Я обновил вопрос. –