A
acpan author
There are a few questions in the forum that asked about horizontal filter and search, such as this and this. tldr (too long don't read) ? Cast your vote above. Okay, here's the details: I attempted to create a demo project to check out how we can implement Horizontal Search and Filter, based on PHPR 10.03 and played with it with inspiration from another 3rd party web portal, which have really good feedback from users about the search and filter functions in a collapsible horizontal format. For the demo i created: My Horizontal Search and Filter Demo URL is here:
Default Search/Filter Panel Vs Horizontal Search/Filter Note: the filter button for demo url Horizontal Search and Filer is just a dummy, it is to show where the filter and search button can be put side by side. To implement Horizontal Advanced Search we can work around with the Page Designer to arrange the fields into Horizontal and use the Dashboard to have the upper part showing the Advanced Search and lower part showing the Grid results, as in one of the examples in the demo URL. Horizontal Filter, we can't drag the fields, so i tried using CSS but it is far less than ideal, as in the demo link. But the idea of having Horizontal filter is there. My personal Conclusion on the demo Horizontal Search and Filter layout:
- It is more user friendly and natural.
- Users are more accustomed to the layout and mobile friendly.
- It is non intrusive and does not get in the way even you have many fields.
Vertical Search Panel and Filter layout:
- When search fields are more, it requires scrolling up and down. This makes the UI difficult to maneuver. When search fields are less, it occupies a left column that gets in the way of the look and feel of the UI.
- To make the Web UI cleaner, i normally turn off the Search Panel and Filter totally, and use advanced search instead. But Advanced Search will divert you to another page or a popup.
- The selection of fields for search panel create a "pause" in the work flow, i.e. Pick what to search in order to search, like in the demo, on the left search panel, you need to figure out a bit about how to use the search and scroll down to look for the search button to click.
Where as, in horizontal format, we can show many of the search fields at once, with a click to un-collapse the search panel above, like in the demo.
- The Filter Panel's data is layout vertical per data, so the more data you have the longer it occupies the screen.
== Suggestions to Sergey Team The PHPRunner Search and Filter are very powerful and easy to implement, it will be great to have optionally in a horizontal collapsible format where we can always implement without worry about complicating the UI. So, i would suggest for Sergey and team to consider
- a collapsible Horizontal Layout for both Advanced Search and Filter on top of a list/grid page.
- For Filter, the ability to drag and drop the fields, like Advanced Search currently does. It is better to have the filter data presented horizontally and user can pick them at one glance and collapse/uncollapse the filter with a click of button, as shown in the demo (the filter button on the right). There is only so much I can do using CSS to make the data horizontal, but the idea is there.
- Make the Horizontal Search and Filter an "insertable" item at Page Designer like "Simple Search" above a LIST/GRID page. (Without the need to use the Dashboard features for Advance Search).
Cast your Vote and Comment Lastly, please play with the demo and have a feel about it, cast your vote above and comment here, if it is good, hopefully Sergey and team can consider that into the future releases. Thank you.
ACPan
|
|