Adding custom elements to filemanager view

Webix JS
#1

Hey guys,

Is it possible to add custom element to filemanager view (tile view) where files’ icons are situated (above them)?

The use case is placing the <div /> (with e.g. some description about how to use the filemanager) in this view on a top of the files instead of placing it somewhere above the filemanager at all. Because in that case we can save some vertical space and make this description scrollable with the files.

Thanks.

p.s. couldn’t place the image with an example, do image attachments work?

#2

Hello @Dennis,

Your description is a bit confusing. Am I getting this right: you want to add a custom element above the DataView(TreeView)/Treetable part? Or do you want to add that element inside of these views and place it above every icon (or just at the very top of the view)?

p.s. couldn’t place the image with an example, do image attachments work?

Attachments aren’t allowed on this forum, afaik. You can, however, use the markdown editor to embed your image straight into your post:

![Name](Link to the image)

Of course, you can also provide the link to the image separately as well.

#3

Hey @Dzmitry,

Sorry for so late reply for this issue.

These are two cases which I’d like to ask about.

  1. There is a header which should be placed on a top of the table (or grid view), right above the table columns’ headers. Currently, we didn’t find the way to place it there and placed it above all the file manager. Is it possible to place custom <div /> (?) inside table and grid views?

  2. There is a paginator at the bottom of the page. It would be great to wrap it with similar <div /> as well so it won’t overlap table data. Maybe the same wrapper like Collapse Button area is… I tried to add such a div and resize $$("table") to have a height of “actual height - 50px (pagination wrapper height)” but it changed a height for lefsidebar tree view as well. Are there solutions to make a wrapper for paginator?

Thanks.

#4

Hello @Dennis,

These are two cases which I’d like to ask about.

1\. You can insert the header in-between the toolbar and the treetable with the help of the onViewInit event handler (it allows you to catch the moment each view inside of the file manager is initialized and get their configuration objects). Here is an example: https://snippet.webix.com/rl4kdkov.

2\. Is there any reason why you can’t place the pager below the file manager? I.e. - https://snippet.webix.com/89g9kytf.