How to Display Tooltip on a Button in FOEX

For end-users, especially for those who are just getting started with using your application, tooltips can be seen as are very helpful. They enable you to provide users with additional guidance on how different features should be used and more importantly, enhance the end-user experience.

In this ‘How To’ article I want to give you a quick solution for how to set up a tooltip on a button within your FOEX application. Before we dive into the technical details, here’s how the end result should look like:

 

FOEX Tooltip on Button

FOEX tooltip on a button example

 

The screen you see above is part of the demo that we’ve recently built, showing how to modernize an Oracle Forms application with FOEX. While we’ve not made the demo available just yet, you’ll be able to test it soon on our website. Until then, the screen shown above is part of a page which contains 2 regions: one containing the product information and another region where you can edit, add or remove a product.

Since we need to highlight this functionality somehow, I will add a tooltip to the button that enables me to add a new product in the list. In this case, pressing the Reset button will empty the form and allow me to add the details for a new product:

 

FOEX Tooltip on Button

FOEX tooltip on a button example

 

So, how do you add a tooltip on a button in your FOEX application?

Actually, it’s quite easy! To add tooltips on buttons in your FOEX application follow this 2 steps:

Step 1: In your application’s Page Designer, select the button which should have a tooltip. In our case, the Reset button:

FOEX Page Designer Button Tooltip

FOEX Page Designer – adding tooltip on a button (step 1)

 

Step 2: Click the FOEX Config button and scroll down to the Additional Config section. There you’ll add the JSON key value “tooltip”.

In our case this is what I’ve used: ”tooltip”:"Reset the form to create a new product”

FOEX Settings - Tooltip on a Button

FOEX Page Designer – adding tooltip on a button (step 2)

 

Save, and you’re all set! Now you should have a nice looking tooltip over the button you selected, just like in the example I shared with you above.

Do you have a technical question about FOEX or want good tips for improving your application? We’ve launched this series of How To articles on how you can improve your FOEX applications even more.

Use #askFOEX on Twitter and we’ll get back to you as soon as possible or sign up for a free trial.

Ask FOEX technical questions

Categories FOEX How To Usecase
Add your comment

Your email address will not be published. Required fields are marked *