The requested page is not available for the requested platform. You are viewing the content for .NET Framework 4.5.2+ platform.

How to: Add a Button to a Detail View Using a Custom View Item

  • 4 min to read

This article describes how to add a custom control to a Detail View. Use this approach when you need to place a custom control near a particular editor in a Detail View. Before using it, make sure the Action Container View Item and Control Detail Item approaches are applicable to your task.

Tip

A complete sample project is available in the DevExpress Code Examples database at http://www.devexpress.com/example=T137443.

A View Item is a ViewItem class descendant. Alternatively, you can inherit from any of the built-in View Items XAF supplies. Refer to the View Items and How to: Implement a View Item topics for additional information on View Items.

This topic contains the following section:

Create a WinForms-Specific View Item

In the WinForms Module project, create the ButtonDetailViewItemWin View Item and decorate it with the ViewItemAttribute to make this View Item appear in the Application Model's ViewItems node.

using System;
using System.Windows.Forms;
using DevExpress.ExpressApp.Editors;
using DevExpress.ExpressApp.Model;
using DevExpress.ExpressApp;
// ...
public interface IModelButtonDetailViewItemWin : IModelViewItem { }

[ViewItemAttribute(typeof(IModelButtonDetailViewItemWin))]
public class ButtonDetailViewItemWin : ViewItem {
    public ButtonDetailViewItemWin(IModelViewItem model, Type objectType)
        : base(objectType, model.Id) {
    }
    protected override object CreateControlCore() {
        Button button = new Button();
        button.Text = "Click me!";
        button.Click += new EventHandler(button_Click);
        return button;
    }
    void button_Click(object sender, EventArgs e) {
        throw new UserFriendlyException("Action from custom view item was executed!");
    }
}

Create an ASP.NET-Specific View Item

In the ASP.NET Module project, create the ButtonDetailViewItemWeb View Item and decorate it with the ViewItemAttribute to make this View Item appear in the Application Model's ViewItems node.

using System;
using DevExpress.ExpressApp.Editors;
using DevExpress.ExpressApp.Model;
using DevExpress.ExpressApp.Web;
using DevExpress.Web.ASPxEditors;
// ...
public interface IModelButtonDetailViewItemWeb : IModelViewItem { }

[ViewItemAttribute(typeof(IModelButtonDetailViewItemWeb))]
public class ButtonDetailViewItemWeb : ViewItem {
    public ButtonDetailViewItemWeb(IModelViewItem model, Type objectType)
        : base(objectType, model.Id) {
    }
    protected override object CreateControlCore() {
        ASPxButton button = new ASPxButton();
        button.Text = "Click me!";
        button.EnableClientSideAPI = true;
        button.Click += new EventHandler(button_Click);
        return button;
    }
    void button_Click(object sender, EventArgs e) {
        WebWindow.CurrentRequestWindow.RegisterClientScript("ShowAlert", 
@"alert('Action from custom view item was executed!');");
    }
}

Add a new View Item on a Detail View

Metadata on the newly implemented View Item is available in the Application Model. You can add the View Item to the required Detail View as described in the How to: Create a Custom Control Detail Item topic.

HT_Add_Button3_1

Display a View Item on a Detail View

Display your button or any other View Items on a Detail View as described in the View Items Layout Customization topic.

AddButtonViewItemToDetailView

See Also