In a series of posts I will walk through some of the new features for RadGrid for ASP.NET AJAX Q2 2008. Here is the first part:

- global cancelable client-side Command event which will be raised for all grid post-back commands (paging, sorting, filtering, group/ungroup, etc.). Example:

<script type="text/javascript"
function RadGrid1_Command(sender, args) 
  alert(String.format("CommandName:{0}, CommandArgument: {1}", args.get_commandName(), args.get_commandArgument())); 
  args.set_cancel(true); 
</script> 
 
<telerik:RadGrid ID="RadGrid1" PageSize="2" Skin="Sunset" runat="server" AllowPaging="true" AllowSorting="True" AllowFilteringByColumn="true" GridLines="None"
 <MasterTableView AllowMultiColumnSorting="true" /> 
 <PagerStyle Mode="NextPrevAndNumeric" /> 
 <ClientSettings> 
   <ClientEvents OnCommand="RadGrid1_Command" /> 
 </ClientSettings> 
</telerik:RadGrid> 

 

 - client-side sort expressions. Example:

function RadGrid1_Command(sender, args) 
    args.set_cancel(true); 
 
    // collection of Telerik.Web.UI.GridSortExpression 
    var sortExpressions = sender.get_masterTableView().get_sortExpressions();  
 
    // GridSortExpression properties: 
    if(sortExpressions.length > 0) 
    { 
        var expression = sortExpressions[0]; 
        var fieldName = expression.get_fieldName(); 
 
        var sortOrder = expression.get_sortOrder(); 
        // Telerik.Web.UI.GridSortOrder (enum): 
        //      Telerik.Web.UI.GridSortOrder.None 
        //      Telerik.Web.UI.GridSortOrder.Ascending 
        //      Telerik.Web.UI.GridSortOrder.Descending 
    } 
     
    // toString() will create coma separated string of all expressions  
 
    alert(sortExpressions.toString());  

 
 - client-side filter expressions. Example:

function RadGrid1_Command(sender, args) 
    args.set_cancel(true); 
 
    // collection of Telerik.Web.UI.GridFilterExpression 
    var filterExpressions = sender.get_masterTableView().get_filterExpressions();  
     
    // GridFilterExpression properties: 
    if(filterExpressions.length > 0) 
    { 
        var expression = filterExpressions[0]; 
        var fieldName = expression.get_fieldName(); 
        var fieldValue = expression.get_fieldValue(); 
        var columnUniqueName = expression.get_columnUniqueName(); 
 
        // enum Telerik.Web.UI.GridFilterFunction 
        var filterFunction = expression.get_filterFunction();  
 
        /*
        Telerik.Web.UI.GridFilterFunction.prototype = 
        {
            NoFilter                : 0,
            Contains                : 1,
            DoesNotContain          : 2,
            StartsWith              : 3,
            EndsWith                : 4,
            EqualTo                 : 5,
            NotEqualTo              : 6,
            GreaterThan             : 7,
            LessThan                : 8,
            GreaterThanOrEqualTo    : 9,
            LessThanOrEqualTo       : 10,
            Between                 : 11,
            NotBetween              : 12,
            IsEmpty                 : 13,
            NotIsEmpty              : 14,
            IsNull                  : 15,
            NotIsNull               : 16,
            Custom                  : 17
        };
        */ 
 
      // toString() will create SQL syntax representing this expression: 
      var asString = expression.toString();  
    } 
 
    // toString() will create string of all expressions with AND 
    alert(filterExpressions.toString());  
 

 

- client-side properties for current page index, virtual items count and multi column sorting. Example:

 
  // get MasterTableView 
  var tableView = $find("<%= RadGrid1.ClientID %>").get_masterTableView(); 
 
  // get/set current page index 
  tableView.set_currentPageIndex(1); 
  var currentPageIndex = tableView.get_currentPageIndex(); 
 
  // get/set virtual item count 
  tableView.set_virtualItemCount(100); 
  var virtualItemCount = tableView.get_virtualItemCount(); 
 
  // toggle multi column sorting 
  tableView.set_allowMultiColumnSorting(!tableView.get_allowMultiColumnSorting()); 
 

 

- client-side property for grid data source and dataBind() method. Example:

// get MasterTableView 
var tableView = $find("<%= RadGrid1.ClientID %>").get_masterTableView(); 
 
// set data source 
tableView.set_dataSource(myDataSource); 
 
// data bind 
tableView.dataBind(); 
 

Enjoy!


About the Author

Vladimir Enchev

is Director of Engineering, Native Mobile UI & Frameworks

Comments

Comments are disabled in preview mode.