Blogger Widgets
  • Sharing Photos using SignalR
  • TFS Extenstion - allows copy work items between projects
  • Displaying jquery progressbar with ajax call on a modal dialog
  • Managing windows services of a server via a website
  • Exploring technologies available to date. TechCipher is one place that any professional would like to visit, either to get an overview or to have better understanding.

Search This Blog

Tuesday, 9 August 2011

JQGrid sorting with date and time column using localization

Have been using JQGrid for quite some time now and have got stuck with unable to sort on DateTime columns. But finally managed a way to be able to handle this. Not only to allow sorting but also should be able use localization and display/sort in current local format.

Not use if this is the right way and works for me. The various DateTime formats available are listed at DateTime formats. Assuming the default date format is "The General Date Short Time ("g") Format Specifier".

DateTimeFormatInfo dateformatInfo = Thread.CurrentThread.CurrentCulture.DateTimeFormat;
string dateFormat = dateformatInfo.ShortDatePattern;

Now that we know the dateformat we are going to use is defined in a variable "dateFormat". Convert this date format string to JQGrid format.
public string ConverToJQGridDateFormat(string DateFormat)
            // Day
            DateFormat = DateFormat.Replace("dddd", "d");
            DateFormat = DateFormat.Replace("ddd", "d");
            DateFormat = DateFormat.Replace("dd", "d");
            // Month            
            DateFormat = DateFormat.Replace("MMMM", "M");
            DateFormat = DateFormat.Replace("MMM", "M");
            DateFormat = DateFormat.Replace("MM", "m");
            DateFormat = DateFormat.Replace("M", "m");
            // Year
            DateFormat = DateFormat.Replace("yyyy", "Y");
            DateFormat = DateFormat.Replace("yyy", "y");
            DateFormat = DateFormat.Replace("yy", "y");
            return DateFormat;

Ok now we have got our JQGrid date format, just apply this to colmodel options. Finally the column for "Invoice date" should be rendered as

name: 'InvDate',index: 'InvDate',sorttype:'date',formatter:'date',formatoptions:{srcformat:'d/m/Y',newformat:'d/m/Y'}
Another mode of accumulating power arises from lifting a weight and then allowing it to fall.
- Charles Babbage


Copyright © 2013 Template Doctor . Designed by Malith Madushanka - Cool Blogger Tutorials | Code by CBT | Images by by HQ Wallpapers