dataFeed

альтернативный источник для отфильтрованных и привязанных данных

Example

webix.ui({
  view: "combo",
  options: {
    body: {
      dataFeed: "//docs.webix.com/samples/server/countries"
    }
  }
});

Related samples

Свойство dataFeed задаёт альтернативный источник данных для:

• в виджете Combobox для загрузки отфильтрованных данных, когда пользователь набирает текст в поле
• для форм и компонентов данных, привязанных к другим компонентам для загрузки данных по запросу компонента-мастера.

url:"main/data", // изначально загружает данные
dataFeed: "datafeed/data" // загружает данные впоследствии

dataFeed как строка

Вы можете передать URL строку в свойство dataFeed. В примере ниже строка используется для серверной фильтрации значений Combo.

Фильтруем данные с помощью строки dataFeed

webix.ui({
  view: "combo",
  options: {
    body: {
      dataFeed: "//docs.webix.com/samples/server/countries"
    }
  }
});

В этом случае dataFeed создаёт GET запрос ""url?filter[fieldID]=" + fieldValue", где:

• fieldID - ID поля данных для фильтрации (по умолчанию, "value");
• fieldValue - значение поля, которое ввёл пользователь.

dataFeed как прокси

С помощью dataFeed как прокси объекта, вы можете:

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

Фильтруем данные через dataFeed как прокси

dataFeed:{
  $proxy: true, // обязательное поле
  load: function(view, params){
    // меняем параметр по умолчанию "value" на "title"
    params["filter[title]"] = params.filter.value;
    delete params.filter;
    return (
       webix.ajax(
          "//docs.webix.com/samples/server/films_sortfilter", params
      )
    );
  }
}

Помните, что из функции load необходимо возвращать промис с данными.

dataFeed как функция

С помощью dataFeed как функции, вы можете

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

В примере ниже для загрузки данных и их парсинга в список используется метод load.

Фильтруем данные через dataFeed как прокси

dataFeed: function(text) {
   // очищаем список от предыдущих значений
   this.clearAll();
   this.load("//docs.webix.com/samples/server/countries?filter[value]=" + text)
}

Вы можете вручную отправить Ajax запрос и вернуть промис с данными:

dataFeed: function(text) {
   return webix.ajax("//docs.webix.com/samples/server/countries?filter[value]=" + text)
      .then(data => {
      // делаем что-л. с данными
      // ...
      return data;
   });
}

dataFeed при привязке компонентов данных

Вы можете использовать свойство dataFeed при привязке компонентов данных и коллекций. Это позволит вам перезагружать данные в привязанный компонент напрямую с сервера, а не с компонента-мастера.

По умолчанию, зависимый компонент получает данные из компонента-мастера. Благодаря свойству dataFeed, зависимый компонент запрашивает данные с другого источника, напр., сервера.

Пример получения удалённых данных через dataFeed

{
  view:"datatable",
  dataFeed:"remote/data",
  // или
  dataFeed:function(id, obj){
    return webix.ajax("remote/data");
  }
  // или
  dataFeed:{
    $proxy:true,
      load:function(view, params){
       return webix.ajax("remote/data");
    }
  }
};

Related sample:  Datatable: Binding Collections with dataFeed

Когда dataFeed используется как функция для загрузки данных в компонент, она принимает следующие параметры:

• id (number) - ID элемента;
• obj (object) - объект с именем поля и его значением.

Однако при использовании свойства как прокси, его функция load принимает другие параметры:

• view (object) - Webix компонент;
• params (object) - параметры для фильтрации.

Если же dataFeed используется, как строка, то создаётся GET запрос ""url?filter[fieldID]=" + fieldValue", где:

• fieldID - ID поля данных для фильтрации (по умолчанию, "id");
• fieldValue - значение поля данных.

dataFeed при привязке форм

В случае форм, вы можете определить dataFeed только как строку или как функцию. Последняя позволяет модифицировать данные перед тем, как запарсить их в компонент в форму.

dataFeed с формой

const form = {
  view:"form", 
  dataFeed:"//docs.webix.com/samples/40_serverside/01_php/server/form.php",
  // или
  dataFeed: function(id){
    webix.ajax("//docs.webix.com/samples/40_serverside/01_php/server/form.php?id="+id)
    .then(data => {
      data = data.json()[0];
      this.setValues(data);
    });
  }
};

Related sample:  Datatable: Binding with Form

dataFeed как строка, создаёт GET запрос наподобие data/form.php?action=get&id=" + fieldValue, где

• fieldID - ID поля данных для фильтрации (по умолчанию, "id");
• fieldValue - значение поля данных.

Наверх