Click here to Skip to main content
Click here to Skip to main content

Tagged as

Currency Masking in Silverlight Datagrid

, 6 May 2010
Rate this:
Please Sign up or sign in to vote.
The code shows how to implement currency masking (format like $21,900) in Silverlight DataGrid using the IValueConverter. User can edit the data in numbers with out entering the commas.Having knowledge in Silverlight data binding to DataGrid is enough to understand the code.Create a simple...

The code shows how to implement currency masking (format like $21,900) in Silverlight DataGrid using the IValueConverter. User can edit the data in numbers with out entering the commas.

 

Having knowledge in Silverlight data binding to DataGrid is enough to understand the code.
Create a simple Silverlight application in Visual Studio and create a class implementing the IValueConverter in the Silverlight project created in the solution, to use the class as value converter to render the values to datagrid cells in the required format.

 
    /// <summary>
    /// <c>CurrencyConverter</c> class converts the values to thousand seperated number in the grid.
    /// </summary>
    public class CurrencyConverter : IValueConverter
    {
        /// <summary>
        /// <c>Convert</c> method will convert to string in a format disirable to show to user.
        /// </summary>
        /// <param name="value">Value to format</param>
        /// <param name="targetType"></param>
        /// <param name="parameter"></param>
        /// <param name="culture"></param>
        /// <returns>Formatted string to bing to grid.</returns>
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            int? inputInt = value as int?;
            if (inputInt.HasValue)
            {
                return "$" + inputInt.Value.ToString("N0", culture);
            }
            else
            {
                decimal? inputDecimal = value as decimal?;
                if (inputDecimal.HasValue)
                {
                    return "$"+inputDecimal.Value.ToString("N0", culture);
                }
            }
            return String.Empty;
        }
        /// <summary>
        /// <c>ConvertBack</c> method will convert back the entered text to value
        /// </summary>
        /// <param name="value">value entered by user.</param>
        /// <param name="targetType">Target type to convert</param>
        /// <param name="parameter"></param>
        /// <param name="culture">Current culture</param>
        /// <returns>Int value of the revenue</returns>
        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            string input = value as string;
            if (input != null)
            {
                if (input[0] == '$')
                {
                    input = input.Substring(1);
                    input = input.Replace(",", "").Replace(".", "");
                    Regex objRegNum = new Regex(@"^\d*[0-9](|.\d*[0-9])?$");
                    if (!objRegNum.IsMatch(input))
                        input = "0";
                    return int.Parse(input);
                }
                else 
                {
                    input = "0";
                }
            }
            return value;
        }
    }
 

Add the datagrid in your Silverlight page, that looks just like the following -

 
<UserControl x:Class="CurrencyMasking.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480"
    xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"
    xmlns:local="clr-namespace:CurrencyMasking;assembly=CurrencyMasking">
<UserControl.Resources>
    <local:CurrencyConverter x:Key="NumberFormatConverter"/>
</UserControl.Resources>
 
<Grid x:Name="LayoutRoot">
    <data:DataGrid AutoGenerateColumns="False" HorizontalAlignment="Left" 
        FontWeight="Bold" x:Name="grdEmp" Height="200"
        RowBackground="#FF75A0D3" VerticalAlignment="Top"
        CanUserResizeColumns="False">
        <data:DataGrid.Columns>
            <data:DataGridTextColumn Width="100" Header="Name"
                Binding="{Binding Name}">
            </data:DataGridTextColumn>
            <data:DataGridTextColumn Width="100" Header="Salary" 
                Binding="{Binding Salary, Converter={StaticResource NumberFormatConverter}}">
            </data:DataGridTextColumn>
        </data:DataGrid.Columns>
    </data:DataGrid>
</Grid>
 
</UserControl>
 

The 'NumberFormatConverter' resource is created from the class CurrencyConverter.  The static resource is binded to the column to render the values in the Currency format.

 

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Narsimlu Keshagouni
Technical Lead Weston Solutions
India India
Hi, I am Narsimlu Keshagouni working as Technical Lead in Hyderabad, India. I work on the technologies:
 
-ASP.NET
-Silverlight
-WCF
-SQL Server
-SSRS

Comments and Discussions

 
GeneralReason for my vote of 5 This works Pinmemberdefwebserver7-Aug-10 10:06 
GeneralNice! PinmemberMatt Kloss2-Jun-11 3:56 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web03 | 2.8.140827.1 | Last Updated 6 May 2010
Article Copyright 2010 by Narsimlu Keshagouni
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid