Back to Devexpress

Data Binding

aspnet-9149-aspnet-mvc-extensions-common-concepts-data-binding.md

latest9.3 KB
Original Source

Data Binding

  • Nov 27, 2019
  • 3 minutes to read

All data-aware DevExpress MVC extensions expose the Bind method, allowing you to easily bind them to a data source (typically, it is a data Model passed from a Controller). There are also some additional methods facilitating data binding to certain declarative data sources. The table below lists data-aware extensions and corresponding available data binding methods.

|

Data-Aware Extension Name

|

Method to Bind to Data Model

|

Declarative Binding Methods

| | --- | --- | --- | |

Diagram

|

DiagramExtension.Bind(System.Object)

DiagramExtension.Bind(System.Object,System.Object)

|

| |

Gantt

|

GanttExtension.Bind(System.Object, System.Object)

GanttExtension.Bind(System.Object,System.Object,System.Object,System.Object)

|

| |

GridView

|

GridViewExtension.Bind

|

GridViewExtension.BindToEF

GridViewExtension.BindToLINQ

GridViewExtension.BindToXML

GridViewExtension.BindToCustomData

| |

Menu

|

MenuExtension.Bind

|

MenuExtension.BindToXML

MenuExtension.BindToSiteMap

| |

NavBar

|

NavBarExtension.Bind

|

NavBarExtension.BindToXML

NavBarExtension.BindToSiteMap

| |

PivotGrid

|

PivotGridExtension.Bind

|

PivotGridExtension.BindToOLAP

PivotGridExtension.BindToEF

PivotGridExtension.BindToLINQ

| |

PopupControl

|

PopupControlExtension.Bind

|

PopupControlExtension.BindToXML

PopupControlExtension.BindToSiteMap

| |

TabControl

|

TabControlExtension.Bind

|

TabControlExtension.BindToXML

TabControlExtension.BindToSiteMap

| |

TreeList

|

TreeListExtension.Bind

|

TreeListExtension.BindToXML

TreeListExtension.BindToSiteMap

TreeListExtension.BindToVirtualData

| |

TreeView

|

TreeViewExtension.Bind

|

TreeViewExtension.BindToXML

TreeViewExtension.BindToSiteMap

| |

Data Editor Extensions

|

EditorExtension.Bind

|

List Editors:

CheckBoxListExtension.BindList

ComboBoxExtension.BindList

ListBoxExtension.BindList

RadioButtonListExtension.BindList

TrackBarExtension.BindList

|

The following code demonstrates how to bind the Chart extension to a Model.

Model code:

csharp
namespace MyProject.Models {
    public class ChartPoint {
        public int X { get; set; }
        public int Y { get; set; }
    }
}
vb
Namespace MyProject.Models
    Public Class ChartPoint
        Private m_X As Integer
        Private mY As Integer

        Public Property X() As Integer
            Get
                Return mX
            End Get
            Set
                mX = Value
            End Set
        End Property

        Public Property Y() As Integer
            Get
                Return mY
            End Get
            Set
                mY = Value
            End Set
        End Property        
    End Class
End Namespace

View Code (Razor):

csharp
@Html.DevExpress().Chart(settings => {
    settings.Name = "chart";
    settings.Series.Add(s => {
        s.Name = "My Data";
        s.SetDataMembers("X", "Y");
        s.Views().SplineSeriesView(v =>{ });
    });
}).Bind(Model).GetHtml()
vb
@Html.DevExpress().Chart(Sub(settings)
    settings.Name = "chart"
    settings.Series.Add(Sub(s) 
        s.Name = "My Data"
        s.SetDataMembers("X", "Y")
        s.Views().SplineSeriesView(Sub(settings)
        End Sub)
    End Sub)
End Sub).Bind(Model).GetHtml()

Controller code:

csharp
using System.Collections.Generic;
using System.Web.Mvc;
using MyProject.Models;

namespace MyProject.Controllers {
    public class HomeController : Controller {
        public ActionResult Index() {
            return View(GetPoints());
        }

        private List<ChartPoint> GetPoints() {
            var m = new List<ChartPoint>();
            m.Add(new ChartPoint { X = 1, Y = 1 });
            m.Add(new ChartPoint { X = 2, Y = 5 });
            m.Add(new ChartPoint { X = 3, Y = 3 });
            m.Add(new ChartPoint { X = 4, Y = 9 });
            m.Add(new ChartPoint { X = 5, Y = 10 });
            return m;
        }
    }
}
vb
Imports System.Collections.Generic
Imports System.Web.Mvc
Imports MyProject.Models

Namespace MyProject.Controllers
    Public Class HomeController Inherits Controller
        Public Function Index() As ActionResult
            return View(GetPoints())
        End Function

        Private Function GetPoints() As List<ChartPoint>
            Dim m As List<ChartPoint> = New List<ChartPoint>()
            m.Add(New ChartPoint With { .X = 1, .Y = 1 })
            m.Add(New ChartPoint With { .X = 2, .Y = 5 })
            m.Add(New ChartPoint With { .X = 3, .Y = 3 })
            m.Add(New ChartPoint With { .X = 4, .Y = 9 })
            m.Add(New ChartPoint With { .X = 5, .Y = 10 })
            Return m
        End Function
    End Class
End Namespace

For specifics of binding DevExpress MVC data editors (listed in Data Editors Extensions), refer to the Binding Data Editors to Data topic.

See Also

Binding to Data