Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / web / ASP.NET

Create Web Forms in Minutes with the New ASP.NET Form Layout Control

4.89/5 (6 votes)
14 Jan 2013CPOL3 min read 39.1K  
Create Web Forms in minutes with the new ASP.NET Form Layout control.

This article is for our sponsors at CodeProject. These articles are intended to provide you with information on products and services that we consider useful and of value to developers

Creating web forms in ASP.NET and Visual Studio is now much easier and quicker using the new DevExpress ASP.NET Form Layout control.Image 1

First, watch this five minute "ASP.NET Form Layout - Getting Started" video to learn how easy it is to use, what features it provides, and why you’ll soon be designing attractive, powerful forms using the DevExpress ASP.NET editor controls:

With the ASP.NET Form Layout control you can easily create form layouts of any complexity by combining the order and hierarchy of provided layout elements.

How does it work?

On your WebForm page, drop the ASPxFormLayout control and then click its smart tag and choose the "Edit Layout" option. That's when the magic happens because the FormLayout editor is displayed.

Then you add one (or more) Layout items and their associated editor controls. Close the FormLayout editor and the complete form will be automatically generated for you using the DevExpress ASP.NET editors you specified. That's it. Within minutes, you've built a complex form such as this one below:

Image 2

Form Layout At Design-Time!

In the Visual Studio designer, we've added the DevExpress FormLayout Editor which is simplified design surface for creating layouts. Using our Form Layout editor, you can quickly create simple or complex forms with any of the DevExpress ASP.NET editors that support validation, themes, and client-side API.

And you still have access to the full properties of each control. Watch the getting started video above to see the design time features.

Online Demo

To see the kind of stunning forms you can make, take a look here: Form Layout Demos 

However, the demos can only show you the forms after they've been created. To truly experience the form layout, download DXperience v2012.2 right now and try it for yourself!

Features

The ASPxFormLayout control delivers a comprehensive form design feature set. The ASPxFormLayout main layout elements are comprised of labeled items, labeled regular groups and tabbed groups.

Item elements serve as placeholders for editors or custom content. Group elements are containers for other layout elements; group nesting is available.

Items provide you with an ability to define inline help texts that describe editor definitions. Help texts can also be defined at the nested editor's level (if DevExpress editors are used in items). An editor's help text can be displayed either always (as an editor inline text) or only when the editor receives focus (as a popup tooltip). Take a look at the memo editor behavior in this demo.

The ASPxFormLayout can also display customizable text marks within item captions to indicate whether filling in an item editor is required or optional. The indicator display mode can be defined for all or individual items. The indicator type is determined based upon a setting defined at the item editor level or item level.

Supports WebForms

In this release, the ASPxFormLayout control is only available for ASP.NET WebForms. ASP.NET MVC is not on the roadmap right to support a "Form Layout" control because the ASP.NET MVC platform is:

  1. Not designer friendly. There is no designer in ASP.NET MVC.
  2. I'm not sure it would be such a popular request.

However, that is the current opinion and if we find that there is a BIG demand for this in ASP.NET MVC then we'll investigate the possibility of creating an ASP.NET MVC Form Layout extension.

Save time and easily create great forms in Visual Studio Design time using your mouse by using the new DevExpress ASP.NET Form Layout control!

License

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