Sortable and searchable

[EmilMoe]

Your datatable looks promising. But both sorting and searching are crucial for most people. (I assume it's not there as I couldn't see it on the demo page)

[Mevrael]

Hi @EmilMoe

Yes, right now there are no any search algorithms implemented in src and this feature is, indeed, a musthave. There are also many things missed in pre-alpha.

Problem is always in time. "Rome wasn't built in a day". That why we always need a teamwork to archieve more. Since last week there was no a demo, since two weeks there wasn't a website at all.

What is related to sorting I believe that there is only one way to do it - column sorting by clicking on the column's with triangle indicating asc/desc. However, in the most datatables I've seen it was impossible to remove sorting after you clicked the column's header. What are you thoughts about making a sorting better from UI and UX point of view?

Searching is a separate topic to discuss because it can be done in many ways. Probably the most common I've seen - just having one text input in top right corner, which searches in all table. The problem is that for bigger tables with many columns it is useless because user can't understand what columns he is searching in.

Searching comes together with filtering which is 3rd musthave function for displaying any data to users.

Do you have any ideas about how it would be simplier to use searching/filtering in <datatable>? I think there could be one input with type="search" which would search everywhere (or at least how API will return data). But what about many filters not just one? May be something like <input type="search" for-column="col-id"> - if it a text column or, for gender, for example - <select for-column="col-id"> ... </select>

However, inputs must be within <form> per spec. What about a <form> inside a <datatable> where you can have one or many inputs of any time but input name should be same as datatbale column's ID?

[EmilMoe]

There will always be a default sorting, so you don't need to remove a sorting again. Wikipedia has sorting and that must be well tested with users.

One approach could be to define an object that contains all json keys that are included in the search. I have seen a datatable with filter and search above/below all columns, that's ugly!

You could for instance make a search field, that by default searches in all defined keys (if none, search all), and if any defined next to the search there could a dropdown where to choose which keys to search in.

You can also make it more up to other developers how it's implemented, by only giving methods for search and filter and then the developer must decide how it's applied from the user perspective.

[Mevrael]

Hi @EmilMoe

In latest update search functionality added to DataTable. More information in this comment: https://github.com/Mevrael/bunny/issues/11#issuecomment-266311168

[joebordes]

FWIW:

• I just tried the search functionality and it is working as expected

• I really like how KendoUI Grid handles sorting and search, in general it is a very good datatable.

• For sorting they permit toggle sorting by clicking on the header cycling through Asc, Desc, None http://demos.telerik.com/kendo-ui/grid/index

• For filtering they open a popup for each column where you pick what you want to filter http://demos.telerik.com/kendo-ui/grid/filter-menu-customization

[Mevrael]

Thanks for the links. KendoUI looks good.

Sorting by column on click is a common practice. In latest version I implemented column filtering ASC/DESC. Here is an example https://bunnyjs.com/examples/datatable/?order_by=age&order_rule=asc&age=3&page=2

Talking about the filtering - BunnyJS is a JS architectural library which provides only logical tools. It is up to user to decide how he wants to display everything including filtering.

In most datatables I've seen columns just had an input above it. You can do this now with Bunny DataTable by adding <input name="column"> or <select name="column"> within <datatable> anywhere you want and style however you need.

[joebordes]

I just tried the sorting feature and it works correctly. Why didn't you add the third option? To undo the sorting: One click: Asc, next click: desc, next click: no sorting, and the cycle again.

[Mevrael]

Yes, it is a good option. Will add in next release. Have another stuff to work on.

[Mevrael]

3rd click implemented in 0.13.4