K2 SmartForms

K2 SmartForms ListView Toolbar Layouts

K2 SmartForms ListView Toolbar

K2 SmartForms are very flexible and allows you as developer to modify each of your views and pages without limits. All the possibilities – even the simplest ones – are not always as intuitive and recognisable. One of these simple yet highly effective modifications is being able to use layout tables in the ListView Toolbar area.

K2 SmartForms ListView Toolbar

K2 ListView Toolbar Layouts – Runtime – 1

On a newly created K2 ListView you can see the toolbar area at the top and the layout table can be found in the controls menu under layout. You can drag any of the controls in the menu onto the toolbar area as well as the layout table to take control of the layout.

K2 ListView Toolbar Layouts - Layout - 2

K2 ListView Toolbar Layouts – Layout – 2

Since it is a common solution to reuse views in K2, your views will probably need to be able to adapt to many different situations and display/hide data and controls per scenario. You can easily accomplish this by grouping a set of data/controls in their own layout table within the main layout table – then instead of having to show/hide each control separately it can be done by just setting the inner layout table’s visibility. This ensures your K2 SmartForm frontend code stays clean and easily maintainable.

K2 ListView Toolbar Layouts - Layout - 3

K2 ListView Toolbar Layouts – Layout – 3

You can use the table settings as well as individual control styles and conditional styles to change the UI layout.

K2 ListView Toolbar Layouts - 4

K2 ListView Toolbar Layouts – 4

The end result is a clean UI without any clutter that can be used for a range of scenarios (dynamically changes with the data & user input) with no additional changes needing to be done after the initial design & development of the view has been completed.

K2 ListView Toolbar Layouts - Runtime - 5

K2 ListView Toolbar Layouts – Runtime – 5

Additional Information

Learn how to implement K2 SmartForms projects successful the 1st time

How to call jQuery or JavaScript code in a K2 SmartForm

K2 SmartForms ListView Toolbar

You may also like

Leave a comment

PODCAST  |  Why you need to establish a K2 Center of Excellence today

Interview with Arno van Rooyen, CEO, Velocity