Несколько <select /> цепочек с KnockoutJS с зависимостями, хранящимися в базе данных - PullRequest
1 голос
/ 16 декабря 2011

Я хочу преобразовать решение цепочки ячеек <select />, которое я уже построил, для использования KnockoutJS. Вот как это работает сейчас:

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

продукт> атрибуты> значения> зависимость

скамья> длина> 42 "> (высота == 16")

В моей базе данных мы также храним, какие значения зависят от других значений. например длина может быть только 42 ", если высота 16" или что-то в этом роде.

Это происходит от сервера до объекта JSON на клиенте, который содержит все атрибуты, значения и зависимости для продукта в древовидной форме.

var product = 
{
    attributes: 
    [
        values: 
        [
            value:
            {
                dependencies: [{dependencyOp}]
            }
        ]

    ]
};

Я переберу каждое значение и его зависимость для всего объекта и создам выражение типа «16 == 14 && 4 == 4», которое, конечно, будет иметь значение false (14 - это выбранное значение из другого атрибута) , в этом выражении && будет зависимостью в массиве зависимостей.

Теперь в моей попытке я использовал подключаемый модуль отображения KnockoutJS, чтобы сделать объект моей моделью представления, но моя проблема в том, когда я создаю зависимый объект, который должен знать, от чего он зависит. Так что теперь мне пришлось бы перебирать каждый отдельный массив / объект в моей переменной продукта?

1 Ответ

2 голосов
/ 04 января 2012

Если я понял ваш вопрос, вы пытаетесь получить данные с вашего сервера и использовать их для определения правильности введенных пользователем данных. Если это так, поместите вашу структуру данных в поле вашей viewModel и сделайте зависимый объект зависимым от этого поля.

function ViewModel() {
    this.data = ko.observable();
    this.input = ko.observable();
    this.isValid = ko.dependentObservable(function() {
        // evaluate input() against data() to determine it is valid; return a boolean
        return ...;
    }, this);

    this.loadData = function() {
        $.ajax('/data/get', {
             success: function(dataFromServer) {
                 this.data(dataFromServer);
             });
    }
}

var vm = new ViewModel();
ko.applyBindings(vm);
vm.loadData();

теперь вы можете ссылаться на этот зависимый объект в атрибуте привязки данных, например

  <input type="text" data-bind="value: input, valueupdate='afterkeydown'" />
  <div data-bind="visible: isValid">shown only when data is valid...</div>
...