Экспорт компонентов данных в CSV

Вы можете экспортировать компоненты в формат CSV. Эта процедура не требует какой-либо дополнительной конфигурации компонентов.

Чтобы экспортировать компонент в PNG файл, вызовите метод toCSV. Метод принимает следующие параметры:

• id (string, object) - ID или оюъект экспортируемого компонента
• config (object) - необязательный параметр. Опции конфигурации

Например, если вы хотите экспортировать список в CSV документ, вам необходимо вызвать метод toCSV() с ID списка в качестве параметра:

webix.ui({
    view:"list",
    id: "mylist",
    // конфигурация списка
});
 
webix.toCSV($$("mylist"));

Related sample:  Export to CSV

Метод toCSV возвращает все данные, указанные в dataset компонента или в параметре columns у *datatable*. Данные экспортируются в CSV документ с именем "data".

Кастомизация экспорта

Некоторые общие моменты кастомизации экспорта можно применять к методу toCSV. Однако также существуют специальные настройки, описанные ниже.

Возможности кастомизации:

• произвольное имя файла
• пользовательские хедер, ширина или темплейт для данных указанного столбца
• отрисовка темплейтов в наборе данных виджета
• определение произвольного разделителя для столбцов
• включение скрытых столбцов и рядов в экспортируемый файл

Как указать произвольное имя файла

Имя выходного файла по умолчанию "Data.csv". Чтобы указать другое имя, используйте параметр filename:

webix.toCSV($$("table"), {
    filename: "table"
});

Как определить пользовательский хедер или темплейт для столбцов

При экспорте DataTable в CSV формат, вы можете указывать произвольные хедеры и темплейты для определённых столбцов:

webix.toCSV($$("table"), {
    columns:{
        "title":{ header: "Title", template: webix.template("#id#.#name#") },
        "year":{ header: "Year" }
    }
});

Темплейт для набора данных

Вы можете отрисовывать темплейты вместо исходных данных с помощью свойства rawValues: false:

webix.ui({
    rows:[
        {
            view:"datatable",
            data:grid_data,
            columns:[
                { id:"title", fillspace:true, template:"Film #title#" }
            ]
        }
    ]
});
 
webix.toCSV($$("$datatable1"),{
    columns:{
        rawValues:false
    }
});

Текст в хедере экспортируемого файла

Вы можете добавить текст в хедер выходного файла с помощью свойства docHeader:

// добавляем произвольный текст в хедер
webix.toCSV($$("mylist"), {
    docHeader:"This document was made with Webix library. https://webix.com"
});

Как указать разделитель

Чтобы определить разделитель для столбцов, используйте webix.csv.delimiter.cols:

webix.csv.delimiter.cols = ",";

Related sample:  Export to CSV

Как включить скрытые столбцы и ряды в экспортируемый файл

По умолчанию скрытые столбцы и ряды не включены в экспортируемый файл. Чтобы включить их, укажите параметру hidden значение true:

webix.toCSV($$("datatable1"), {
    hidden: true
});

В CSV файле скрытые столбцы/ряды будут отображаться.

Наверх