Note this post has been developed by WebClient Application Consultant Matt Fleming of ADC Austin. You can reach matt at mfleming@adcaustin.com.
Even with the style sheets, the base functionality of a WebClient i+ for CA Plex application behaves in the same way that the original Plex function did. While this is useful, we can improve the original application’s functionality to make it more web-like in functionality.
Let’s look at this Order function as an example. This post uses the WXPCOURSE model and application that is supplied as an example with your WebClient software install, and is typical of a standard Plex application. Lets look at a popup modal dialog first.
Click on the ‘Add new data’ button, 
and you will see the Insert pop-up display.
This pop-up now works exactly as it did as generate for CA Plex client-server. However, WebClient gives us the ability to leverage a great deal of modern controls and techniques that allow us to improve the user interface. In this exercise we will make some minor changes that can greatly improve an application.
1. Hint Text
Sometimes the labels on a data entry screen don’t convey quite enough information about what data is expected. Adding hint text helps new users to know what should be entered into that particular field and adding that functionality is quite simple with WebClient.
You already have the panel open, so just highlight the edit control of the ID field, and in the same manner that you added text to the Control Name of the Order Date, add the following line to the Control Name of the ID field:
CustID:MainArea:hint=Customer ID:default
Save the panel and close it. Generate and build to see the results.
You can see that in the ID field, the hint we placed there lets the user know that the ID we are looking for there is the Customer ID. When you click on that field, the hint text disappears, and allows the user to enter the data they need to.
2. Grid Stretch
In many CA Plex grid’s you have the situation that the grid is actually bigger than what the columns needed. Rather than adjusting the size of the grid manually, we can actually specify one column to expand to fill the empty space, allowing room to accommodate the possibility of a long field.
To use this effect open up an grid panel in CA Plex and bring up the properties for the grid. As before, enter a value into the Control Name:
Grid1P:MainArea:stretch=Grid1PItem Description:default
Generate and build to see the result.
Before:
After:
We have only scratched the surface of the number of ways that you can extend and improve your application for use in a browser using WebClient.
