ASP.NET GridView': Align Right Numerical Values from Code Behind

Tuesday, November 30, 2010

While creating generic user controls having GridViews, its not easy to format columns based on data the columns will have. The type of the data a column will have is not always known until the data is bounded on to the grid. The data on the GridView looks a lot better, when numerical values, dollar/currency amounts, percentages etc. are aligned to the right of the cells. This could be easily accomplished using the RowDataBound event of the GridView and then matching the cell value to a regular expression to determine if it matches your criteria for alignment.

Here is a sample implementation for a RowDataBound method for the GridView, which looks for cells having only numbers, comma (,) and a period(.) in the contents and if it finds a match, it aligns it to the right:

// C#
protected void gridViewt_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        // Right align the column if its a numerical value
        for (int i = 0; i < e.Row.Cells.Count; i++)
        {
            if(Regex.IsMatch(e.Row.Cells[i].Text.Trim(), @"^[0-9,.]*$"))
            {
                e.Row.Cells[i].HorizontalAlign = HorizontalAlign.Right;
            }
        }
    }
}

>

' VB.Net
Protected Sub gridViewt_RowDataBound(sender As Object, e As GridViewRowEventArgs)
 If e.Row.RowType = DataControlRowType.DataRow Then
  ' Right align the column if its a numerical value
  For i As Integer = 0 To e.Row.Cells.Count - 1
   If Regex.IsMatch(e.Row.Cells(i).Text.Trim(), "^[0-9,.]*$") Then
    e.Row.Cells(i).HorizontalAlign = HorizontalAlign.Right
   End If
  Next
 End If
End Sub

You can change the regular expression depending on what all do you you want to match to align the data to the right.

ASP.NET: Change GridView's Row Color onMouseOver

Thursday, September 30, 2010

GridView is a good control to display tabular data. Its easy to use GridView's standard built-in templates and have some good formatting with alternate row colrs and other settings. Also, when you have a lot of columns in your table its always handy if the row is highlighted when you put your mouse over to it. GridView does not has that feature built into it, but its really easy to add it by adding some code into the RowDataBound event of the GridView. Here is how the code will look like in the code behind:

// C#
protected void gridView_RowDataBound(object sender, GridViewRowEventArgs e)
{
    // Creating hover effects on mouseover event for each row
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        e.Row.Attributes["onmouseover"] = "this.style.background='#D1DDF1';";

        if ((e.Row.RowIndex % 2) == 0)  // if even row
            e.Row.Attributes["onmouseout"] = "this.style.background='#EFF3FB';";
        else  // alternate row
            e.Row.Attributes["onmouseout"] = "this.style.background='White';";
    }
}

' VB.Net
Protected Sub gridView_RowDataBound(sender As Object, e As GridViewRowEventArgs)
 ' Creating hover effects on mouseover event for each row
 If e.Row.RowType = DataControlRowType.DataRow Then
  e.Row.Attributes("onmouseover") = "this.style.background='#D1DDF1';"

  If (e.Row.RowIndex Mod 2) Is 0 Then
   ' if even row
   e.Row.Attributes("onmouseout") = "this.style.background='#EFF3FB';"
  Else
   ' alternate row
   e.Row.Attributes("onmouseout") = "this.style.background='White';"
  End If
 End If
End Sub

The code above, adds the 'onmouseover' and 'onmouseout' attributes to each of the table rows in GridView. Make sure you match the onmouseout colors to the colors in your original template. You can also use the 'onclick' attribute instead of 'onmouseover' if you want to change the color on clicking a row.

This feature could also be potentially implemented on client-side using jQuery and CSS. If you'd like to do it that way, use the 'onmouseover' or 'onclick' event of jQuery to change your row colors and then change them back in the 'onmouseout' event.

ASP.NET: Setup the Page Title from Web.Sitemap

Wednesday, August 04, 2010

ASP.Net allows you to associate a sitemap file with your project. You can add this file as a Web.Sitemap in the web project. This file could be used with the ASP.Net navigation controls to create menu, tree view or a site map path on your website. One of the other things where this file comes handy is when you want to dynamically assign title to your pages. This is a fairly common requirement when you use master pages and don't want to modify additional parameters on individual pages. Here's the code you should add into your master page's .cs file:

// C#
protected override void OnInit(System.EventArgs e)
{
    base.OnInit(e);

    // Setting Page Title from SiteMap
    SiteMapNode node = SiteMap.CurrentNode;

    if (node != null && !string.IsNullOrEmpty(node.Title))
    {
        Page.Title = "App Name | " + node.Title;
    }
}

' VB.NET
Protected Overrides Sub OnInit(e As System.EventArgs)
 MyBase.OnInit(e)

 ' Setting Page Title from SiteMap
 Dim node As SiteMapNode = SiteMap.CurrentNode

 If node IsNot Nothing AndAlso Not String.IsNullOrEmpty(node.Title) Then
  Page.Title = "App Name | " + node.Title
 End If
End Sub

The above function adds the associated title associated with the url of the page.

this.blog was Hibernating, but @gsmodi was Awake

Thursday, March 18, 2010

It has been a long time since I last posted on this blog - the longest interval between any two consecutive posts on this blog. Posting long posts on the blog has suffered because of the convenience and ease of posting something in less than 140 characters on Twitter (@gsmodi). The USP of Twitter is its simplicity. The fact that you can use it from multiple devices and applications still getting all the required functionality makes it stand out.

This blog now goes into hibernation rather more frequently than anytime in the past. Its just not about me losing interest in blogging or having a busier schedule; its about the plethora of other social networks which take up the time I might have spend on blogging. Facebook and Twitter are the hot suites of this era. I am regular on both the network though seldom like to post on Facebook, but do tweet rather frequently. Still trying to decipher why I don't like to update my status on Facebook but can tweet about just anything (related tweet). I am sure there are many who share the same syndrome. Another network which I frequent is LinkedIn, which I believe is an excellent way for professional networking and getting updates about your contacts.

The arena of social networks is perpetually being enhanced. If we try to look through the past few years, social networks have evolved marvelously. Everyone wants a share of this huge pie. While Facebook might be leading the race at this time (some people also talk about it as the next big thing after Google), these sites have a history of being overturned by competition. We all have seen the fate of MySpace, Orkut and the likes. Though each have been successful in their times in particular regions of the world, they tend to die out and are superseded by the competition. With Google coming up with Buzz, fresh networks like Tumblr gaining popularity and a plethora of other services which are launched everyday, this would be an interesting space to watch.

OK, that was a bit about social networks - was not supposed to be in this post, could have written a complete post on that stuff. So, coming back to the main point, should I let this blog die out? I don't think so, I've been maintaining it for over 4 years now. I'll try to be more regular, maybe write shorter posts more frequently and cut down the time to do some research before posting about something. Lets see how that turns out.

@gsmodi (Twitter) will hopefully still be awake and this.blog would try hard to wake up ;)