M# Tutorials

Learn to build .NET applications with M#. Our step-by-step tutorials will get you up-to-speed rapidly.
If you already know ASP.NET and C#, you can master M# in a week or two.

Column formatting

Formatting data is essential for the end-user, in this lesson we will learn how to do this in a list.

Context

Let's go back to our HelloWorld application and add a few properties to our Employee entity.

Now create a list on employee, you should get the following M# module and this UI.

Format

As you can see in the previous image the user experience can be improved. The email address could be a "mailto" link, the date of birth could be shorter, the age can display "years old" and hide digits and the salary doesn't need decimal points.
We can change the format of a column with the help of the "Display format" attribute.

This attribute is equivalent to

"[format]".FormatWith([item])

,

String.Format("[format]", [item])

and

[item].ToString(["format]")

.

Format DateTime

In our case we don't need to display the time for the date of birth column. Set the display format to "{0:d}" for removing the time.

You can find help on MSDN for formatting dates.

Format Double

Use the format "{0:0.} years old" for removing digits in the age and adding a suffix.

You can find help on MSDN for formatting numbers.

Format Currency

Use the format "{0:c0}" for removing digits in the currency.

You can find help on MSDN for formatting currency and other custom values.

Format with HTML

To convert the email address text to a "mailto" link we can set the format to "<a href="mailto:{0}">{0}". If you look at the web page the result is not what we expected because the content is encoded to HTML for security reasons.

To bypass this security we will have to do it manually by using the "Display expression" attribute.

Our Email column is now correctly formatted.