📜 ⬆️ ⬇️

History of one interface

screenshot

There was only one project. And he had an interface for selecting certain entities living in a tree structure.

Initially, it looked like ordinary drop-down menus with scrolling. However, after a while the entities became much and the work with them acquired the character of torture. Users asked to make at least a sajest.
')
It was just boring to make the sadget, so I did a thing like this that looks a bit like Mackovsky’s Finder in multicolumn mode. Hence the name - b-finder.

Initially, "Finder" was sharpened only for one project. But the people liked this thing and repeatedly asked me whether it could be used anywhere else. Therefore, I decided to “untie” it from the project and make a jQuery plugin for greater compatibility.

What can:

- Display tree structures of arbitrary nesting;
- Wander through the structure using the arrows on the keyboard;
- Select with the Enter key;
- Search by word and display selected entities (green button);
- Accept custom settings and callbacks;
- Work asynchronously.

What does not know how:

- Work in IE below 8;
- Make coffee.

Requirements:

- Enabled JavaScript;
- jQuery 1.6+.

References:

- source code and documentation ;
- b-finder in action .

Similar controls:

- DeviantArt (choice of category when adding work);
- From hand to foot (region selection).

For obvious reasons, I do not pretend to the novelty of the idea and the execution. I would be glad if someone come in handy.

Source: https://habr.com/ru/post/133054/


All Articles