Dataviewjs: table with sort buttons and filter fields?

Help
1

Maybe someone know any worked dataviewjs example?

2

Have you searched this forum? This have at least partially been answered.

3

Yes, I looked at it

And not a single working example

Etc .

In general, nothing useful

The most working option here is It is possible to add a search bar in dataviewjs · blacksmithgu/obsidian-dataview · Discussion #1175 · GitHub - use properties to control filtering and sorting - but this is a crutch

And now let’s compare this situation with the solution for the data analysis language, where the table is sorted in columns by DEFAULT, as I need it: DT: An R interface to the DataTables library

And the functionality has not been added to the front-end js, has it?

Maybe someone has a working solution that allows you to perform basic sorting and filtering of the table?

4

I did hack something like this together recently for fighting game study.
I basically put table controls in my yaml, something like:

table:
  filter:
  - game
  - character
  - obsolete
  sort:
  - id asc
  - date desc
  header:
  - id
  - date
  - notation
  - link

Then in the dataviewjs I would set up some useful filters to respond to this data, and apply the sorts in order. When I put the table code in a view, I can reuse the table and customise it with the header to show different parts of my data. It would be nice to be able to click column headers to impact the sorting, but this is good enough for me for now.
I can show the full code example but it has a lot of fgc stuff that might not make much sense.

One thing to note is I turn off dataview updates and only refresh manually, triggered by a shortcut templater insertion, which means less optimal code doesn’t impact me as much.

5

It’s always hard to understand how much work has been done to research before asking a question like yours, and I answered when on the move and didn’t have the time to do the search for a solution which might fit your needs, but in the thread below one option by @reaty , with a variant by @Anwen , is presented doing some of this.

Now for a more general approach to this question, and that is that I know of two main approaches to handling such a case, and that is either on the “serverside” where the server (or main script in our case) handles all the action, or “clientside” where the main script attaches javascript to the table itself to do it after presenting all the data to the client.

The main difference is that doing it serverside requires reloading of stuff all the time when changing the parameters, and when being on clientside you’ll need to load all of your data into the page to allow it to handle everything afterwards.

Sadly, neither option is directly supported by Obsidian (or Dataview), and you’ll need to some extra code to handle it. I’ve not seen any recent generic code doing this, with the exception of the builtin handling by some plugins. So you’re left with either complementing scripts like that above by reaty and/or anwen, or doing it yourself. In other words, you need to be know some coding, and there are many disturbances on the way…

When it comes to plugins, you might want to look into either of the following plugins Dataloom, DB Folders and/or Metadata menu. These offer various tools to handle data similar to Dataview, and I believe they offer some filter/sorting capabilities if you’re able to present your data using those tools.

Disclaimer: I’ve not used any of those tools extensively, only Dataview, so I can’t warrant for the stability or usefulness of either one, but I do know they offer some of the functionality you want.

With regards to Dataview though, I’ve been thinking to review/look into the solution I linked to above as it seems promising, but the need hasn’t been high enough that I’ve bothered. In most cases, I’ve just changed the query itself if I wanted a different sorting/filtering, which in my case has been good enough as I don’t really analyse the data, more present various bits and pieces.

There is however one caveate with Obsidian, which makes me really wonder whether Obsidian is the tool for analysing larger amount of data clientside, and that is for ordinary documents Obsidian does a lazy load of the document, and if you scroll beyond a certain amount it unloads the earliest data. Whether this comes to play in a query based data table I’m not sure, but I’ve seen and heard of it happening for any larger static table/note.

So if I would venture into something like this, I’d first look into whether the data stays loaded in the first place before doing it clientside, and if keeping it serverside you need to store your filter/sort parameters into the frontmatter or similar, and keep doing Dataview: Rebuild current view (or similar manipulation of the DOM) since your script doesn’t really change causing caching issues to occur if you don’t trigger manual rebuilds.

1 Like
6

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.