dataFeed

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

string| object| function dataFeed;

Example

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

Related samples

Details

Свойство 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 - значение поля данных.
See also
Наверх
If you have not checked yet, be sure to visit site of our main product Webix ui component library and page of datagrid in html5 product.