Form

• Oct 07, 2025
• 2 minutes to read

Form is a UI component for data editing with a customizable layout for arranging editors in columns, groups, and tabs. It automatically selects the most suitable editors based on the data type.

Run Demo: Form Read Tutorial

Getting Started

The Form UI Control is based on the DevExtreme Form component.

To add this control to your project, follow instructions in the following help topics:

• Configure a Visual Studio Project or Configure a non Visual Studio Project
• Add Controls to a Project
• Razor Syntax

Basic Syntax

FormBasics.cshtml

@(Html.DevExtreme().Form()
    .FormData(new {
        OrderNumber = "#12345",
        OrderDate = new DateTime(2025, 9, 2),
        CustomerName = "John Doe",
    })
)

FormController.cs

using System;
using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc;

namespace ASP_NET_Core.Controllers {
    public class FormController : Controller {
        public IActionResult GettingStarted() {
            return View();
        }
    }
}

Built-in Capabilities and Configuration Guides

• Automatically Generate Form Fields
  The DevExtreme Form component creates form items from the defined data object. Use the items array to configure each form item.

• Multiple Editor Types Support
  Choose from 18 DevExtreme editors to display Form data.

• Validation
  DevExtreme includes a validation engine that checks edited Form values before they are saved.

• Flexible Layout
  Form can organize items into columns, groups, and tabs.

• Adaptability
  You can specify different Form layouts for different screen widths.

API

Server-Side API

Initialization

Call the Form() method to create a Form control. This action initializes a FormBuilder<T> instance. Use the instance methods to specify Form options and event handlers.

Options

For a complete option list, see Options. For details on how to specify control options, refer to the following help topic: Specify Options.

Events

For available events, see Events. For details on how to handle events, refer to the following help topic: Handle Events and Define Callbacks.

Client-Side API

Options

If you need to specify the Form options dynamically on the client side, use client-side API. For a complete option list, see DevExtreme Form options.

Methods

For a list of available methods, see DevExtreme Form methods. For details on how to call methods, refer to the following help topic: Call Methods.

Accessibility

For more information on Form accessibility compliance, refer to the following help topic: Accessibility.

Demos

Run Demo: Form