User Interface

Format strings are used to format data before presentation to the end user. There are standard numeric and date/time format strings. In addition, custom date/time format strings can be created. The formatting is performed in the client web browser by default.

Microsoft.NET offers rich data formatting capabilities. Developers may request formatting of field values on the server to take advantage of everything it has to offer.

For example, the Unit Price field in the Order Details controller uses the standard currency format string of “c”. An application with en-US culture will format the number as a currency with a dollar sign on the left, period as a decimal separator, and parenthesis's to indicate negative values. The $0.00 indicates a zero value.

Server-side formatting offers additional field value formatting options.

Start the Project Designer. In the Project Explorer, switch to the Controllers tab and double-click on Order Details / Fields / UnitPrice field node.

Change the following properties:

The data format string is a custom numeric format string. Positive, negative, and zero value strings are separated by a semicolon.

Press OK to save the field. On the toolbar, click on the Browse button to generate the web application.

Navigate to the Order Details page. The values in Unit Price field will be formatted according to the custom numerical format string. All eight digits will be displayed. Zero values will be represented with the text “Zero Value”.

Notice that when the row is in edit mode, the values of fields formatted on the server will be displayed in raw form.

Different edit forms can be used depending on the field values of a record. For example, the Customers table has a Postal Code column.

Customers in the United States refer to the Postal Code as a “ZIP Code”. Let’s create another edit form for customers from USA that uses the “ZIP Code” label for Postal Code, and is rendered in two columns.

Start the Project Designer. In the Project Explorer, switch to the Controllers tab. Right-click on Customers / Views node, and select New View option.

Give this view the following settings:

Press OK to save the view. In the Project Explorer, right-click on Customers / Views / editFormUSA view node, and select New Category.

Assign the following settings:

Press OK to save the category. In the Project Explorer, right-click on Customers / Views / editFormUSA / c100 – Customer Information category node, and select New Data Field.

Assign the data field these properties:

Save the data field. Create several more data fields with the following settings:

Right-click on Customers / Views / EditFormUSA view node, and select New Category.

Give the category these settings:

Press OK to save. Add the following data fields to this category:

Now that the new edit form has been configured, let’s change the action state machine to direct USA  customers to the correct form.

In the Project Explorer, right-click on Customers / Actions / ag1 (Grid) action group node, and select New Action.

Give this action the following settings:

Press OK to save the action. In the Project Explorer, move the action into second place, after ag1 – Select.

Double-click on Customers / Actions / ag1 (Grid) / a1 – Select action node.

Change the When Client Script property:

Press OK to save the action. On the toolbar, press Browse to generate the web application.

Navigate to the Customers page. Select a customer that is not from the United States. The standard edit form will be displayed.

Select a different customer with Country of “USA”. The new two-column edit form will be displayed. “Postal Code” is replaced by “ZIP Code”.