Properties and Enums

A number of MVC controls have properties that take enumeration values.

For example, the FlexChart's chartType property takes values of type wijmo.chart.ChartType.

You can set enumeration properties using the enum symbol, numeric value, or name. For example, following three ways are equivalent:

// setting the value of an enumeration property
theChart.chartType = wijmo.chart.ChartType.Line; // best: IntelliSense!
theChart.chartType = 'Line'; // concise and easy to understand
theChart.chartType = 3; // concise but hard to understand

Regardless of the method used, when you make the assignment MVC will convert the values into proper enumeration and store the converted value. If the conversion fails, an exception will be thrown. For example:

// errors
theChart.chartType = wijmo.chart.ChartType.MyType; // bad value
theChart.chartType = 25; // out of bounds
theChart.chartType = 'line'; // wrong case

Live example:

The current chart type is 0 ('Column'). Use the following combobox to switch to other chart type.

Chart Type:

// This file locates: "Scripts/Lesson/C1Mvc/PropertiesEnums.js".
c1.documentReady(function () {
    var theChart = wijmo.Control.getControl('#theChart');
 
    // try out different chart types
    var currentType = document.getElementById('currentType');
    var chartType = wijmo.Control.getControl('#chartType');
    chartType.textChanged.addHandler(function (s, e) {
        updateChartType();
    });
    updateChartType();
 
    function updateChartType() {
        theChart.chartType = chartType.selectedItem;
        currentType.textContent = theChart.chartType +
          ' (\'' + wijmo.chart.ChartType[theChart.chartType] + '\')';
    }
});

using System.Web.Mvc;
 
namespace LearnMvcClient.Controllers
{
    public partial class C1MvcController : Controller
    {
        // GET: PropertiesEnums
        public ActionResult PropertiesEnums()
        {
            return View(Models.FlexChartData.GetSales1());
        }
    }
}

@model IEnumerable<FlexChartData.Sale>
 
<h1>
    @Html.Raw(Resources.C1Mvc.PropertiesEnums_Title)
</h1>
<p>
    @Html.Raw(Resources.C1Mvc.PropertiesEnums_Text1)
</p>
<p>
    @Html.Raw(Resources.C1Mvc.PropertiesEnums_Text2)
</p>
<p>
    @Html.Raw(Resources.C1Mvc.PropertiesEnums_Text3)
</p>
<pre>// setting the value of an enumeration property
theChart.chartType = wijmo.chart.ChartType.Line; // best: IntelliSense!
theChart.chartType = 'Line'; // concise and easy to understand
theChart.chartType = 3; // concise but hard to understand
</pre>
<p>
    @Html.Raw(Resources.C1Mvc.PropertiesEnums_Text4)
</p>
<pre>// errors
theChart.chartType = wijmo.chart.ChartType.MyType; // bad value
theChart.chartType = 25; // out of bounds
theChart.chartType = 'line'; // wrong case</pre>
 
<h4>
    @Html.Raw(Resources.C1Mvc.PropertiesEnums_Title1)
</h4>
<p>
    @Html.Raw(Resources.C1Mvc.PropertiesEnums_Text5)
</p>
 
<div class="demo-settings">
    <label for="chartType">@Html.Raw(Resources.C1Mvc.PropertiesEnums_Text6) </label>
    @(Html.C1().ComboBox().Id("chartType")
    .Bind(new object[] { "Column", "Bar", "Scatter", "LineSymbols", "Area", "SplineSymbols", 0, 1, 2, 3, 4, 5 })
    )
</div>
 
@(Html.C1().FlexChart().Id("theChart")
    .Bind("Country", Model)
    .Series(series=> {
        series.Add().Binding("Sales").Name("Sales");
        series.Add().Binding("Expenses").Name("Expenses");
    })
)