Экспорт в CSV

Чтобы экспортировать данные из компонента данных в документ CSV, вызовите метод toCSV с двумя параметрами:

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

Например, чтобы экспортировать таблицу в документ CSV:

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

Related sample:  Export to CSV

Настройка экспорта

По умолчанию: - Метод toCSV возвращает все данные указанные в наборе данных компонента или в параметре columns компонента DataTable. - Данные экспортируемые в CSV названы "Data".

Вы можете изменить некоторые настройки по умолчанию.

Вы можете

1. задать другое имея для файла
2. убрать теги HTML из ячеек
3. задать другие столбцы для экспорта
4. задать пользовательский хедер или темплейт
5. включить дополнительные поля
6. включать скрытые столбцы и ряды при экспорте
7. отобразить темплейт установленный в наборе данных
8. задать желаемый разделитель столбцов
9. отключить загрузку файла в браузере
10. проигнорировать определенные столбцы во время экспорта
11. опустить хедер или футер таблицы во время экспорта
12. вывести определенные данные из набора данных

• задать другое имея для файла:

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

• убрать теги HTML из ячеек:

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

• определить столбцы, которые вы бы хотели увидеть в экспортируемом файле. Существует два способа задать столбцы для экспорта:

Вы можете задать объект с ID столбца в качестве ключей. Для параметров по умолчанию их значения могут быть булевыми (взятыми из конфигурации компонента) или объектом:

webix.toCSV($$("table"), {
    columns:{
        "rank":true,
        "title":{ header:"Title", width:250}
    }
});

При такой записи, порядок столбцов в итоговом файле определяется автоматически с помощью цикла for.. in. Иногда это может оказаться ненадежным, например:

webix.toCSV($$("table"), {
    columns:{
        "rank":true,
        "title":{ header:"Title", width:250},
        "2016":{ header:"Votes in 2016"},
        "2015":{ header:"Votes in 2015"}
    }
});

Порядок в этом экспортируемом файле будет: "2015", "2016", "rank", "title", так как числа обрабатываются первыми и поступают в порядке возрастания.

Чтобы установить строгий порядок столбцов укажите столбцы как массив:

webix.toCSV($$("table"), {
    columns:[
        { id:"rank" },
        { id:"title", header:"Title", width:250},
        { id:"2016", header:"Votes in 2016"},
        { id:"2015", header:"Votes in 2015"}
    ]
});

Если в этом случае вы хотите получить параметры столбца по умолчанию, вам нужно указать только ID столбца (смотри столбец "rank").

• задать параметр header или template parameter для данных в столбце:

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
    }
});

• включить дополнительные поля в экспорт формируя их прямо в функции экспорта:

webix.toCSV($$("table"), {
    columns:{
        Custom1:{
            template:function(obj){
                return "Year " + obj.year;
            },
            header:"Year"
        },
        //other columns
        title:true
    }
});

"Custom1" (может быть использовано любое имя) получает данные из поля year даже если оно не отображено в таблице, но представлено в наборе данных. Поле отображается с width, template и header, которые будут в хедере соответствующего столбца экспортируемой таблицы.

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

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

Скрытые столбцы/ряды в файле будут видны.

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

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

• отключить загрузку файла в браузере с помощью настройки download:false:

webix.toCSV($$("table"), {
   download:false
}).then(function(blob){
   //обработка данных
});

• проигнорировать определенный столбцы во время экспорта с помощью свойства ignore. Задайте его значение как объект со списком имен столбцов, которые должны быть проигнорированы. Например:

webix.toCSV($$("table"), {
    ignore: { "votes":true, "rating":true }
});

• опустить хедер или футер таблицы во время экспорта Для этого используйте свойства header/footer со значением false:

webix.toCSV($$("table"), {
    header:false,
    footer:false
});

Related sample:  Export to CSV

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

webix.toCSV($$("data"), {
    filter:function(obj){
        var found = sel.find(function(item){
            return item.id == obj.id;
        });
        return found;
    }
});

Наверх