Компонент для работы с электронными таблицами (Excel и подобные).
Webix SpreadSheet позволяет создавать и редактировать электронные таблицы, доступные онлайн, но физически при этом находящиеся локально. Вы можете также импортировать и экспортировать таблицы из файлов Excel. Вы можете изменять вид таблиц: настраивать цвета, шрифты и границы ячеек, выравнивать содержимое ячеек, объединять ячейки, ряды и колонки.
Компонент поддерживает работу с математическими формулами. Вы можете изменять размеры таблиц и локализовывать их.
Подробнее читайте в описательной документации.
var spreadsheet = webix.ui({
view:"spreadsheet",
data: base_data
});
| addImage | добавляет изображение в ячейку |
| addSheet | добавляет новый лист в SpreadSheet |
| addSparkline | добавляет спарклайн в ячейку |
| addStyle | создает новый стиль |
| adjust | подстраивает размеры компонента под размеры HTML-контейнера |
| alert | создает модальное всплывающее окно alert |
| attachEvent | задает обработчик внутреннего события компонента |
| bind | связывает данные компонентов |
| blockEvent | временно блокирует вызов ВСЕХ событий вызывающего объекта |
| callEvent | вызывает внутреннее событие компонента |
| changeDecimals | увеличивает/уменьшает число знаков после запятой в одной ячейке или в нескольких |
| clearRange | очищает диапазон ячеек (выбранные ячейки или указанные в параметре метода) |
| clearSheet | очищает открытый лист Spreadsheet |
| combineCells | объединяет ячейки |
| compactStyles | удаляет неиспользуемые стили |
| confirm | создает и показывает диалоговое окно confirm |
| define | переопределяет одну или несколько настроек компонента |
| deleteColumn | удаляет колонку по ее id |
| deleteRow | удаляет ряд таблицы по его id |
| destructor | разрушает компонент |
| detachEvent | удаляет обработчик события (который был задан ранее методом attachEvent) |
| disable | блокирует компонент (он становится серым, клики по нему не срабатывают) |
| eachSelectedCell | проходит по всем выбранным ячейкам |
| editSheet | начинает редактирование названия листа таблицы (открывает редактор) |
| enable | делает активным ранее заблокированный компонент |
| filterSpreadSheet | фильтрует таблицу в SpreadSheet по всем фильтрам |
| freezeColumns | фиксирует указанное число колонок (слева) |
| freezeRows | фиксирует ряды таблицы (сверху) |
| getActiveSheet | вернет имя открытого листа |
| getCellEditor | вернет объект редактора, заданного для ячейки |
| getCellFilter | вернет объект фильтра, заданного для ячейки |
| getCellValue | возвращает значение в ячейке |
| getChildViews | возвращает внутренние компоненты |
| getColumn | возвращает объект с настройками колонки SpreadSheet |
| getFormView | возвращает объект формы, которой принадлежит компонент |
| getNode | возвращает HTML-элемент компонента |
| getParentView | возвращает родительский компонент |
| getRangeValue | возвращает значения из диапазона ячеек |
| getRow | возвращает данные из ряда таблицы по id ряда |
| getSelectedId | возвращает первую ячейку из выбранных |
| getSelectedRange | возвращает диапазон выбранных ячеек |
| getSheetData | возвращает данные из одной или нескольких ячеек таблицы |
| getStyle | возвращает стили ячейки |
| getTopParentView | возвращает самого верхнего родителя |
| groupUndo | объединяет переданные ему действия в одно действие, которое потом можно будет отменить |
| hasEvent | проверяет, есть ли у компонента обработчики указанного события |
| hide | скрывает компонент |
| hideColumn | скрывает или показывает колонку |
| hideGridlines | скрывает или показывает сетку в таблице |
| hideHeaders | скрывает хедеры колонок и рядов таблицы |
| hideRow | скрывает или показывает ряд |
| ignoreUndo | не включает действия в историю операций, которые можно отменить |
| innerId | возвращает внутренний ID элемента по его общедоступному (реальному) ID |
| insertColumn | добавляет пустую колонку слева от от указанной |
| insertRow | добавляет пустой ряд над указанным |
| isCellLocked | проверяет, заблокирована (защищена) ли ячейка |
| isColumnVisible | проверяет, отображается ли колонка |
| isEnabled | проверяет, активен или заблокирован компонент |
| isRowVisible | проверяет, отображается ли ряд |
| isVisible | проверяет, виден ли компонент |
| load | загружает данные из внешнего источника данных |
| lockCell | блокирует (защищает от редактирования) одну или несколько ячеек |
| mapEvent | направляет события от одного компонента к другому |
| parse | загружает данные, доступные на клиенте |
| queryView | возвращает внутренние компоненты, которые удовлетворяют указанному условию |
| recalculate | вызывает пересчет формул в открытом листе |
| redo | повторяет действие, отмененное методом/кнопкой undo |
| refresh | перерисовывает spreadsheet |
| registerMathMethod | добавление новой формулы |
| removeFilters | убирает фильтры из листа |
| removeSheet | удаляет лист из таблицы |
| renameSheet | переименовывает лист |
| reset | сбрасывает настройки SpreadSheet |
| resetUndo | очищает историю операций |
| resize | перерисовывает компонент после изменения размеров |
| saveCell | сохраняет изменения (значение и стиль) в ячейке |
| serialize | сохраняет данные из SpreadSheet в объект JSON |
| setCellEditor | добавляет в ячейку редактор |
| setCellFilter | добавляет фильтр select в ячейку |
| setCellValue | задает значение ячейке |
| setColumnWidth | задает ширину колонки spreadsheet |
| setFormat | задает условное форматирование для значений в ячейке |
| setPlaceholder | заполняет плейсхолдеры в таблице данными |
| setRangeStyle | задает стиль диапазону ячеек |
| setRangeValue | задает значение для диапазона ячеек |
| setRowHeight | задает высоту ряда таблицы в spreadsheet |
| setStyle | задает стиль для ячейки |
| show | делает компонент видимым |
| showCell | переводит фокус на указанную ячейку |
| showFormulas | скрывает или показывает формулы внутри ячеек |
| showSheet | открывает лист таблицы |
| sortRange | сортирует ячейки |
| splitCell | разбивает объединение ячеек на исходные ячейки |
| ui | позволяет создать новый пользовательский интерфейс, область видимости ID которого будет изолирована внутри родительского компонента |
| unbind | отменяет связывание компонентов |
| unblockEvent | отменяет блокировку событий, которая была вызвана командой 'blockEvent' |
| undo | отменяет последнюю операцию в SpreadSheet |
| zoom | увеличивает масштаб листа |
| onAfterConditionSet | срабатывает после того, как пользователь задал новое условие для ячейки |
| onAfterLoad | срабатывает после завершения загрузки данных |
| onAfterRangeSet | срабатывает после добавления именованного диапазона ячеек |
| onAfterSelect | срабатывает после выбора ячейки |
| onAfterSheetShow | срабатывает после того, как пользователь открыл лист |
| onAfterSpan | срабатывает после объединения ячеек |
| onAfterSplit | срабатывает после удаления объединения ячеек |
| onBeforeCommentShow | срабатывает перед тем, как пользователь открыл комментарий к ячейке |
| onBeforeConditionSet | срабатывает перед тем, как пользователь задал новое условие для ячейки |
| onBeforeFormatChange | срабатывает перед тем, как пользователь изменил формат ячейки |
| onBeforeLoad | запускается непосредственно перед началом загрузки данных |
| onBeforeSheetMenu | срабатывает перед показом меню листа на нижней панели |
| onBeforeSheetShow | срабатывает перед тем, как пользователь открыл лист |
| onBeforeSpan | срабатывает перед объединением ячеек |
| onBeforeSplit | срабатывает перед разъединением ячеек |
| onBeforeValueChange | срабатывает перед изменением значения в ячейке |
| onBindRequest | срабатывает, когда компонент готов получить данные из главного компонента |
| onCellChange | срабатывает после изменения значения в ячейке |
| onChange | срабатывает после любого изменения в таблице |
| onColumnOperation | срабатывает после того, как пользователь выполнил операцию над столбцами |
| onCommand | срабатывает при выборе опции в контекстном меню, открытии внешнего UI или диалогового окна, обновлении тулбара, выполнении какого-либо действия над таблицей |
| onCommentHide | срабатывает после того, как пользователь закрыл комментарий к ячейке |
| onComponentInit | срабатывает во время инициализации Spreadsheet |
| onContextMenuConfig | срабатывает каждый раз перед открытием контекстного меню |
| onDataParse | срабатывает после начала загрузки данных в Spreadsheet |
| onDataSerialize | срабатывает после начала сериализации данных |
| onDestruct | происходит, когда компонент был разрушен деструктором |
| onFormatChange | срабатывает, когда пользователь изменил формат ячейки |
| onLoadError | срабатывает при возникновении ошибки во время загрузки данных (невалидный ответ с сервера) |
| onMathRefresh | срабатывает после пересчета значений формулами |
| onReset | срабатывает после сброса настроек SpreadSheet |
| onRowOperation | срабатывает после того, как пользователь выполнил операцию над строками |
| onSheetAdd | срабатывает после добавления нового листа в таблицу |
| onSheetRemove | срабатывает после удаления листа из таблицы |
| onSheetRename | срабатывает после переименования листа |
| onStyleSet | срабатывает после добавления стиля для ячейки |
| onUIEditStart | срабатывает при открытии формы для редактирования |
| onUIEditStop | срабатывает при закрытии формы для редактирования |
| onUndo | срабатывает при выполнении команд undo/redo |
| onViewInit | срабатывает перед инициализацией каждого компонента в spreadsheet |
| onViewShow | срабатывает, когда компонент появляется (вызов метода show()) |
| animate | определяет анимацию для показа компонента в Multiview |
| borderless | скрывает или показывает границы компонента |
| bottombar | добавляет панель с вкладками для переключенимя между листами таблицы |
| buttons | задает блоки с кнопками для главного тулбара Spreadsheet |
| clipboard | включает/отключает работу с буфером обмена на десктопных устройствах |
| clipboardDecimalDelimiter | задает разделитель для десятичной части чисел (нужно для корректной работы копирования/вставки данных из Excel и наоборот) |
| clipboardNumberFormat | задает формат для корректного копирования/вставки чисел между SpreadSheet и Excel |
| columnCount | задает число колонок в SpreadSheet |
| columnWidth | задает ширину колонки по умолчанию (в пикселях) |
| conditionStyle | задает стили для условного форматирования |
| container | HTML-контейнер (или его ID), внутри которого компонент должен быть инициализирован |
| css | имя CSS-класса, который будет присвоен HTML-элементу компонента, или объект со стилями |
| data | данные для компонента (массив, типизированный массив, XML или CSV) |
| datatype | тип загружаемых данных |
| disabled | блокирует или разблокирует компонент |
| gravity | задает удельный (относительный) размер компонента |
| height | задает высоту компонента |
| hidden | скрывает компонент после его инициализации |
| id | ID компонента |
| liveEditor | переключает редактор формул в spreadsheet |
| maxHeight | задает максимальную высоту компонента |
| maxWidth | задает максимальную ширину компонента |
| menu | добавляет меню над главной панелью инструментов SpreadSheet |
| minHeight | задает минимальную высоту компонента |
| minWidth | задает минимальную ширину компонента |
| on | позволяет присоединять обработчики к внутренним событиям компонента |
| padding | определяет пространство между границами лейаута и его содержимым |
| paddingX | задает правый и левый отступ внутри лейаута |
| paddingY | задает верхний и нижний отступы внутри лейаута |
| prepareData | подготавливает данные перед парсингом |
| readonly | делает таблицу в SpreadSheet нередактируемой |
| resizeCell | отключает/включает возможность изменять размер ячеек |
| rowCount | число рядов в таблице в SpreadSheet |
| rowHeight | задает высоту рядов по умолчанию |
| save | хранит путь к серверу для сохранения изменений ячеек |
| sheetStubs | учитывает стили в пустых ячейках при загрузке файлов Excel |
| sheetTabWidth | задает ширину вкладки листа таблицы |
| subbar | добавляет компонент между тулбаром и таблицей |
| toolbar | устанавливает режим и конфигурацию тулбара |
| type | определяет границы и отступы в лейауте |
| url | путь к данным, которые загрузятся в компонент сразу после инициализации |
| width | задает ширину компонента |
| $$ | возвращает объект внутреннего компонента по его id |
| $getSize | возвращает текущий размер компонентов |
| $handleSelection | определяет поведение компонента при его выборе |
| $height | текущая высота компонента |
| $setNode | определяет HTML-элемент компонента |
| $setSize | задает размеры компонента |
| $skin | вызывается после применения скина |
| $view | возвращает HTML-элемент компонента |
| $width | текущая ширина компонента |
| comments | коллекция, в которой хранятся комментарии к ячейке |
| conditions | модуль для работы с условиями |
| config | все настройки, заданные при инициализации компонента |
| name | возвращает имя компонента (свойство только для чтения) |
| ranges | модуль для работы с именованными диапазонами в формулах |
| views | модуль для работы с компонентами поверх ячеек |