ASP.NET New Features - 2010 Volume 1

We have added 2 new ASP.NET AJAX controls, Outlook®-style Group By to the WebHierarchicalDataGrid™, AJAX compression that will save you and your user's network traffic, and superior Microsoft® Visual Studio® 2010 support.

WebExplorerBar™ - NEW!

The new ASP.NET AJAX explorer bar control based on the Aikido™ Framework provides you with functionality like that found in the Windows Vista® explorer bar: items are contained in groups, and these groups may be expanded or collapsed with animated effect on click, double-click or mouse over. Its many features, lightweight nature, and dynamic client-side operations give you all of the behaviors, APIs and events that you need. In any situation where you formerly used WebListBar™ you should now use WebExplorerBar.

Display Modes

There are several display modes that allow you to configure WebExplorerBar to behave like a side bar (all groups expanded), accordion-style bar (any number of groups expandable) or explorer bar (one group expandable at a time).

Load on Demand

Only load what your users need based on the explorer bar's expanded groups for optimal performance. This gives your users a more responsive user experience because they don’t have to wait to request the contents for collapsed groups they cannot see.

Data Binding

Robust data binding to your hierarchical data lets you easily turn hierarchical data from WebHierarchicalDataSource™ and other data sources such as the XmlDataSource control into groups, items, even nested items. You can fully specify through ExplorerBarItemBinding objects how you want to direct the mapping of your hierarchical data onto the items of WebExplorerBar.

Of course, if you prefer to manually add groups and items at design-time, in code-behind or at run-time, we also give you that flexibility through the Groups and Items collection properties.

URL Navigation

WebExplorerBar lends itself well to site and application navigation scenarios. When your users click on a group header or an item which has its NavigateUrl property set, the explorer bar will navigate to the Web page or load the page into a named iFrame that you can specify with the Target property.

Keyboard Navigation

Enabled groups and items can be activated by using the keyboard navigation shortcuts:

• Up Arrow – Moves up to the next higher item or group
• Down Arrow – Moves down to the next lower item or group
• Left Arrow – Collapses the selected group or item having child items
• Right Arrow – Expands the selected group or item having child items
• Home – Moves to the first item unless that item is disabled
• End – Moves to the last item unless that item is disabled
• Enter – Opens the NavigateUrl of the group or item

Custom Appearance

WebExplorerBar gives you fine control over its appearance at run-time. Instead of containing items, you can assign an ASP.NET template to a group so that it displays arbitrary content such as other ASP.NET controls like textboxes and drop-down listboxes. In addition to its template support, you can independently style the explorer bar's groups and items to distinguish between their selected, disabled, hover and default states. We include plenty of professionally-designed style sets from our visual designers that will give your application a professional appearance.

WebTab™ – NEW!

The new ASP.NET AJAX tab control is also based on the Aikido™ Framework, and it is the successor to the former tab control because it adds significant new functionality. It is AJAX-enabled out of the box, and allows you to use all ASP.NET AJAX controls as tab content inside of its template area. WebTab is full of functionality from its animation to its movable tabs, from its ASP.NET validator support to the ease with which you can add images to its tab headers.

Add, Edit, Delete Tabs

You can add tabs using "Edit Tabs" on the smart tag at design-time, or dynamically add, update and delete ContentTabItems from the Tabs collection at run-time. There is an easy way to create user interfaces in which your users may add new tabs, by enabling the AddNewTabItem property. It's just as easy to enable users to remove tabs, by giving them a Close Button.

Content URL and Template

You can customize the header and content pane of each tab item for your application's needs. You can fill the content pane with either an ASP.NET template featuring arbitrary content, or give it a URL of content that you want to appear within it. WebTab also features an AutoSize property that you can set which will adjust the size of the ContentPane to best fit its content automatically.

Load on Demand

If your user doesn't select any other tabs, why should they have to wait for content residing on other tabs to be downloaded to the client? Since our ASP.NET AJAX tab supports Load on Demand, your users don’t have to! Give your users a more responsive user interface by only loading content that they need to see in the selected tab's ContentPane during the initial load.

When your users select another tab, then two things happen. First, WebTab caches the content on the tab the user was just looking at (figuring that there is a good chance the user may return to it later and thereby saving a request in the future.) Second, content for the newly selected tab is requested from the server so that it can be displayed in the ContentPane.

Whenever the WebTab must wait for an asynchronous callback to complete, it uses our AJAX indicator so that you can have a consistent wait notification across all your Aikido™ Framework-based controls, or you can override the shared AJAX Indicator settings specifically for the tab with a configurable wait message or positionable image.

Multi-Row Tabs

In the Multi-Row display mode you can have your tabs appear stacked with row breaks at positions you can specify through the NextRow property on ContentTabItem. If you don’t want to worry about row breaks, then the Multi-Row Auto display mode is for you. In this display mode, tab rows and their row breaks are adjusted dynamically on the client for best-fit.

Vertical Tabs

While most tab controls let you render horizontal tabs, you can choose to orient WebTab either horizontally or vertically by setting the TabOrientation property. Another property, the TabLocation property, allows you to control on which of the four sides of the ContentPane the tabs should begin aligning themselves. So you could have your tabs appear at the top or bottom edge (left or right edge) and to either side as necessary.

Scrolling Tabs

In the Scrollable display mode, a single row of tabs will appear with scroll buttons. Instead of your tab headers having to become narrower to fit any additional tabs (e.g., when TabOverflow is set to Reduce in the single- or multi-row display modes), you can have as many tab headers as you want because the user simply scrolls any extra tabs into and out of view.

Close Button

Similar to what users have come to expect when they are using tabbed browsing, WebTab lets you enable a close button on all tabs. Your users can then close any tab by clicking on its close button.

Keyboard Navigation

WebTab supports very easy navigation through its support of the keyboard whenever its EnableActivation property is True:

• Left Arrow – Makes the tab on the left active
• Right Arrow – Makes the tab on the right active
• Home – Makes the first tab active
• End – Makes the last tab active
• Space or Enter – Selects the currently active tab

Stylable Tabs

Tabs can have different states that are individually customizable by using the Application Styling Framework including normal, hovered, selected, activated and disabled states. We include plenty of professionally-designed style sets from our visual designers that will give your application a professional appearance.

Overlapping Tabs

You can also enable adjacent tabs to appear overlapped with one another by setting the EnableOverlappingTabs property to True. The appearance of overlapping tabs in particular can be custom-tailored using their own CSS class.

WebHierarchicalDataGrid - Enhanced

We have added Outlook-style Group By to the ASP.NET AJAX hierarchical data grid so your users can group data into more readable and navigable views. Group By displays a section (the group by area) at the top or bottom of the grid, so that your users can drag columns into it with their mouse or by pressing the Control+Alt+G key combination. Once grouped, rows with a common value in that column will appear together under an expandable/collapsible GroupedRecord within the user interface.

We included this feature in the WebHierarchicalDataGrid because the presentation of GroupedRecords to the user is intrinsically nested. But this does not mean you can't use Group By with flat data! If your application uses flat data but benefits from Group By behavior, then you would simply choose WebHierarchicalDataGrid instead of WebDataGrid™ as your ASP.NET AJAX data grid control.

Group By Area

As always, you can fully style this area through CSS using the GroupAreaCssClass property and related Application Styling Framework roles. Customize its positioning so that it appears at the top or at the bottom of your ASP.NET AJAX data grid using the GroupByAreaLocation property. When the group by area is empty, you can assign it some text in EmptyGroupAreaText with a call to action to your user inviting him or her to drag columns to this area to group by.

Group By Comparer

You can specify your own Group By logic, answering the question "What other rows does this row match?" It need not be a strict equality. You can assign your own IEqualityComparer<T> that is of the same data type T as the column to that column's GroupByComparer property, and have it determine into which groups your rows belong. This feature is priceless in scenarios where you'd like to group by any kind of range or interval, for example to group by week (all dates within the past week, all dates between one week to two weeks, etc.) It can also be used to group by rows with a value in that column starting with a particular character to create alphabetical groupings.

Group By Row Text

You can supply your own text to mask the group by row description, allowing you to use text descriptions such as "Last Week", "2 Weeks Ago", "3 Weeks Ago", etc., for your ASP.NET AJAX data grid's groupings.

Group By Across Bands

Your users can group by across two or more bands so that any columns, from any bands in your data source, are groupable. Of course, you can turn off EnableColumnGrouping on the column-level and the band-level, so it is possible to have bands which do not allow their columns to be grouped.

Fully Stylable

You can fully style grouped rows, columns and bands with the GroupedRowCssClass, GroupedColumnCssClass, and GroupedBandCssClass properties, respectively. There are also 3 Application Styling Framework roles associated with the Column and Band styling that offer fine grained control over the left edge, middle area, and right edge of Columns and Bands as they appear grouped. You can also set CSS classes to style the floating column indicator which the user drags to the Group By area, and all aspects of the drop indicator (top, middle and bottom) as well.

Ungrouping

To ungroup, your user can just drag a column header down from the Group By area. You can also programmatically remove a grouped column from the collection of grouped columns, that will also have the effect of ungrouping by that column (you can tie this to other UI elements within your application). There are client-side methods to group and ungroup columns, these will cause an AJAX callback which will accomplish the same effect of removing the column from the collection. Finally, there is a RemoveButton that appears (although you can hide it by setting the ShowRemoveButton property to False) when users hover above a grouped column header that they can click to make the column ungroup itself.

AJAX Compression Module – NEW!

This new feature allows you to GZip-compress server-generated AJAX responses to any of our Aikido™ Framework-based controls. The client GZip-decompresses the response to update the user interface. By activating this feature, you gain the following savings:

• Save on Bandwidth - Network bandwidth needed for the now compressed AJAX response size sent from the server to the client decreases automatically. This will allow you to serve more users at a time on network connections with the same bandwidth. If you are using a service provider that charges you based on the amount of data transferred, compressed response sizes is something that will save you money.
  
  
  
  
  
• Save on Time – As response size decreases, so does the time it takes to receive the return leg of a round-trip AJAX callback. The entire compressed response will be received on the client before an uncompressed response would be received, allowing the UI to respond to the user more quickly.
  
  
  

All you need to do to enable AJAX compression and achieve these performance gains in your own Web applications is to add the Infragistics.WebUI.Framework.Compression HttpModule to the <httpModules> section of your "web.config".

Visual Studio 2010 Support – Enhanced

With Visual Studio 2010 coming out shortly from Microsoft, we have continued investing in making our ASP.NET controls give you a complete Web development experience within the Visual Studio 2010 integrated development environment (IDE). Explore Visual Studio 2010 and NetAdvantage ASP.NET.

JavaScript IntelliSense®

Our ASP.NET AJAX controls now support the high-performance and standards-compliant JavaScript IntelliSense engine in Microsoft Visual Studio 2010 so you can receive informative IntelliSense tips as you are writing your code.

One-Click Deployment

Quickly publish the files and configuration settings necessary to use NetAdvantage® ASP.NET controls within your application from your development machines to your final deployed site with our support for "One Click Deployment".

Integrate Silverlight into ASP.NET Solutions

Our ASP.NET controls have full support for integrating Silverlight into your Web projects and solutions.

SharePoint® Design-Time Integration

Now when you are creating WebParts for SharePoint, you can use our ASP.NET controls at design-time with the enhanced SharePoint design-time integration within Visual Studio 2010.