Making the Table Grid control more interactive with new enhancements
Your CRUD interfaces – admin portals, GUIs, dashboards – are the backbone to any internal operation. And the display components like the Table Grid, Detail View, Charts are the primary interface for end users to visualize, process, and consume data to take action.
If you need to add a component to your app to display data in a tabular format and allow user to take action with it, without building it entirely from scratch – even the most popular libraries would require you to make some tweak and customize the table component to achieve the baseline CRUD functionality, formatting, and so on – not to mention any additional enhancement to make your app look more cohesive.
We solve this pain point with the Table Grid control (check it here)
Contrary to cells in a spreadsheet that support a handful of data types (like alphabets, numerical data), DronaHQ’s Table grid UI control provides a rich table functionality with many different data types––including file, URL, Geolocation, and DateTime to name a few. These enable users to add and view more detailed information.
Users could view data from their data sources (Postgres, Mongo, Firebase, Google Sheets, etc., join data from one source to another (say joining customer ticket data from Zendesk with order data from MySQL) and work seamlessly with different data attributes within a single data table.
The table grid gives users the power to connect and work with all their data in one place and create simple applications.
DronaHQ’s Table Grid Control provides Rich table functionality
The Table Grid control has been our most used UI control on the DronaHQ platform. It is a staple to admin panels and CRUD interfaces being built for use cases across marketing, sales, HR, finance, admin, and many more.
One of the most powerful tabular UI components out there in the low code space, DronaHQ’s table grid comes pre-baked with CRUD functionalities like add, edit, delete. You can read about its features and capabilities here.
Today, we’re excited to roll out few quality-of-life enhancements to the Table Grid – the immediate advantage being that you can build admin tools that are all the more interactive for the end users – all without writing any redundant code.
1. Hide/Show Columns
The end users can now hide or show columns based on their use case.
Say in your product catalog app created for the sales force, you have a whole list of SKU attributes displayed on the table however on the field, the sales rep only needs to see 4 – product name, SKU size, price, max discount in order to take the conversation up with customers – the salesperson can tweak which columns are visible on their end user portal without impacting the table on other end user portals.
2. Reorder Columns
The end user can reorder columns in the Table Grid control.
Similar to our example above, say it is critical for the salesperson to see max discount column right next to the product in order to push discounted product to customers – they can do so on their end
The above two features were earlier available only for the app makers/admins designing the UI however, now the end user can also tweak the columns based on the details they need to see on their mobiles/web apps.
These settings are persistent.
3. Add Events to Cell Click
App makers can now trigger an action flow on click of a cell. Say you’ve displayed customer data with attributes like email, phone number, account, Linkedin url, etc. You would like to send out an email, make a call, or open their LinkedIn URL right upon clicking the respective attribute on the table. Earlier such actions were only possible on a row click. Adding events to cell-click drastically reduces the time needed to perform such actions from the front-end.
4. Edit columns in the table itself
The typical end user is already familiar with how basic operations work on a spreadsheet, whether to view data or add new information to a table. The table grid closely resembles the traditional spreadsheet with rows and columns. However, it takes it up a notch by providing a host of aforementioned features. So far the table grid sported pre-built CRUD operations that triggered a tray-type screen to open up to allow the specific action to be executed (say Edit a record).
The table grid will now enable end users to edit the data in the table itself without having to open up any additional modals or screens or pop ups.
5. Add new table rows
One of the most useful features of a table grid control is the ability to add new rows directly within the control itself. This allows users to quickly and easily input new data without having to navigate to a separate form or dialog box. This feature can be especially useful for data entry tasks and can save a lot of time and effort for users. Additionally, adding new rows directly within the table grid control allows for real-time updates and can improve the overall efficiency of the application. Overall, the ability to add new rows directly within a table grid control is a valuable feature that can greatly enhance the user experience.
This is just the beginning
While these are few brilliant updates that our customers are loving, we know the table grid is capable of supporting a lot more use cases and so it will keep on evolving.
Be sure to check out our growing library of UI controls here.