ASP.NET: Caption for Text Editors (v14.1 release)

01 July 2014

Check out the new Caption property that saves you time from adding extra label controls:

DevExpress ASP.NET Data Editors - Caption Property in v14.1

The new Caption property, in the v14.1 release, lets you set the editor's prompt text for the DevExpress ASP.NET Text Editors. And it's most helpful to use this property when you need to align the controls in a toolbar style layout.

In the image above, we've used the new Caption property to align a label and combo box controls inside of our Reports toolbar. Using this new approach, we can align them easily without any additional markup.

Customize Caption Appearance

You can use the following properties to customize the appearance of the caption:

Position – specifies the position of a caption related to the editor.
HorizontalAlign, VerticalAlign – specify the horizontal and vertical alignment of a caption.
ShowColon – specifies whether the colon sign is displayed after caption text.
RequiredMark – specifies text displayed after a caption when the editor value is required.
OptionalMark – specifies text displayed after a caption when the editor value is optional.
RequiredMarkDisplayMode – specifies which mark should be displayed after a caption.

Try this functionality now with our online Data Editors - Caption ASP.NET WebForms demo.

ASP.NET WebForms and MVC

The Caption property is available for both ASP.NET platforms: ASP.NET WebForms and ASP.NET MVC.

Form Layout

If you have a form then I recommend using the DevExpress ASP.NET Form Layout control that helps you create forms within minutes:

Create Web Forms in minutes with the new ASP.NET Form Layout control

Your Next Great .NET App Starts Here

Year after year, .NET developers such as yourself consistently vote DevExpress products #1.

Experience the DevExpress difference for yourself and download a free 30-day trial of all our products today: DevExpress.com/trial (free support is included during your evaluation).

Free DevExpress Products – Get Your Copy Today

The following free DevExpress product offers remain available. Should you have any questions about the free offers below, please submit a ticket via the DevExpress Support Center at your convenience. We’ll be happy to follow-up.

Mehul Harry (DevExpress) Web Program Manager

Email: mharry@devexpress.com

Twitter: @Mehulharry

Bo Johansen_1

I don't understand why marking a control as required/optional should be restricted to the caption?

I would much rather have the ability to style the required/optional control itself (or both the control and the caption).

Add to the mix the ability to style a control which fails validation, and I would be a happy camper!

1 July 2014

Ian Pook

Hi Mehul.

Does the caption property allow alignment of the parent controls (as in your picture above, the controls are vertically aligned with each other) or will the caption take the length of its text producing a 'stepped' effect of the parent controls?

2 July 2014

Mehul Harry (DevExpress)

Ian,

The CaptionCellStyle->Width property gives it the space/alignment in the picture above. Otherwise, it'll have the stepped effect based on how long the text is. If you have a lot of editors then I recommend using our excellent form layout control which takes of alignment and so much more:

community.devexpress.com/.../create-web-forms-in-minutes-with-the-new-asp-net-form-layout-control.aspx

Thanks.

2 July 2014

Mehul Harry (DevExpress)

Hi Bo,

>>"Add to the mix the ability to style a control which fails validation"

You can solve this task by using the ValidationSettings.ErrorFrameStyle property. The error frame is displayed if the editor's value has not passed validation criteria specified. Check out the documentation on this topic which also has an example of how to use the ErrorFrameStyle - documentation.devexpress.com

Thanks.

3 July 2014

Bo Johansen_1

Hi Mehul,

I think you misunderstood my point about being able to style a control which fails validation...

As far as I can see the ErrorFrameStyle will only style a frame around the control which fails validation - this is not what I want.

If the control is i.e. an ASPxTextBox, I want to be able to style the ASPxTextBox itself!

I like to style my required controls by setting the background color of the control to something different than the background color of my optional controls. Setting the background color of a required control will send a stronger visual message to the user than displaying i.e. "(*)" in the caption in my opinion.

To my knowledge this can not be done with DevExpress' controls (I know that it can be done using CSS), and that's what I would like to be able to do.

Basically I would like to have this functionality:

- RequiredStyle (will be used when ValidationSettings.RequiredField.IsRequired == true)

- OptionalStyle (will be used when ValidationSettings.RequiredField.IsRequired == false)

- ValidationFailed (will be used when validation fails)

Thanks,

Bo Johansen

8 July 2014

Mehul Harry (DevExpress)

Hi Bo,

Yes, the InvalidStyle was implemented: www.devexpress.com/.../S32860 .

So, you can use the InvalidStyle property to customize styles for editors which didn't pass validation. As for required and optional styles, we are not planning to implement this but there is a custom solution - please see this example: www.devexpress.com/.../T127452

16 July 2014

James Birnie

Hi Mehul

I just started implementing these Caption properties - they will save me a couple of minutes of formatting for each new control. This is only a small thing I know, but I really appreciate it!

Cheers,

James

19 July 2014

Mehul Harry (DevExpress)

Thanks Jamie!

21 July 2014

Please login or register to post comments.

Need help or require more information?

Announcing DevExpress Universal v22.2

DevExpress Wins 20 Visual Studio Reader’s Choice Awards

ASP.NET: Caption for Text Editors (v14.1 release)

Customize Caption Appearance

ASP.NET WebForms and MVC

Form Layout

Your Next Great .NET App Starts Here

Free DevExpress Products – Get Your Copy Today

Recent Posts