ComponentOne
Web API Explorer ASP.NET Web API Explorer
MVCFlexGrid

MVCFlexGrid

Overview

This sample demonstrates how to export and import a mvc flexgrid.

Features

Overview
Paging
Virtual Scrolling
Grouping
Filtering
Frozen Cells
Remote Data Bind
Tree View
Disable Server Reading
Conditional Styling
ID
Start
End
Country
Product
Color
Amount
Amount2
Discount
Active
1
1/25/2025
1/25/2025
France
Widget
Red
($1,227.26)
$3,217.05
3%
2
2/25/2025
2/25/2025
Japan
Gadget
White
$395.57
($284.69)
13%

Settings


Export & Import
Export Name :           

Description

This sample demonstrates how to export and import a mvc flexgrid.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
using System.Collections;
using System.Globalization;
using System.Linq;
using System.Web.Mvc;
using C1.Web.Mvc;
using WebApiExplorer.Models;
using System.Collections.Generic;
using System;
 
namespace WebApiExplorer.Controllers
{
    public partial class MVCFlexGridController : Controller
    {
        private readonly GridExportImportOptions _flexGridModel = new GridExportImportOptions
        {
            NeedExport = true,
            NeedImport = true,
            IncludeColumnHeaders = true
        };
 
        private readonly ControlOptions _gridDataModel = new ControlOptions
        {
            Options = new OptionDictionary
            {
                {"Items",new OptionItem{Values = new List<string> {"5", "50", "500", "5000"},CurrentValue = "500"}},
                {"Allow Sorting", new OptionItem {Values = new List<string> {"True", "False"}, CurrentValue = "False"}},
                {"Formatting", new OptionItem {Values = new List<string> {"On", "Off"}, CurrentValue = "Off"}},
                {"Column Visibility",new OptionItem {Values = new List<string> {"Show", "Hide"}, CurrentValue = "Show"}},
                {"Column Resize", new OptionItem {Values = new List<string> {"100", "250"}, CurrentValue = "100"}}
            }
        };
 
        public ActionResult Index(FormCollection collection)
        {
            IValueProvider data = collection;
            if (CallbackManager.CurrentIsCallback)
            {
                var request = CallbackManager.GetCurrentCallbackData<CollectionViewRequest<object>>();
                if (request != null && request.ExtraRequestData != null)
                {
                    var extraData = request.ExtraRequestData.Cast<DictionaryEntry>()
                        .ToDictionary(kvp => (string)kvp.Key, kvp => kvp.Value.ToString());
                    data = new DictionaryValueProvider<string>(extraData, CultureInfo.CurrentCulture);
                }
            }
 
            _gridDataModel.LoadPostData(data);
            var model = Sale.GetData(Convert.ToInt32(_gridDataModel.Options["items"].CurrentValue));
            ViewBag.Options = _flexGridModel;
            ViewBag.DemoOptions = _gridDataModel;
            return View(model);
        }
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
@using WebApiExplorer.Models
@using C1.Web.Mvc.Grid
@model IEnumerable<Sale>
@{
    ControlOptions optionsModel = ViewBag.DemoOptions;
    GridExportImportOptions exportOptionsModel = ViewBag.Options;
    ViewBag.DemoSettings = true;
}
 
<script>
    function collectingQueryData(sender, e) {
        if (e.extraRequestData == null) {
            e.extraRequestData = {};
        }
 
        @foreach (var menuName in optionsModel.Options.Keys.Select(ControlOptions.ToOptionName))
        {
        <text>
        e.extraRequestData["@(menuName)"] = '@(optionsModel.Options[menuName].CurrentValue)';
        </text>
        }
    }
</script>
 
@(Html.C1().FlexGrid<Sale>()
    .Id(exportOptionsModel.ControlId)
    .AutoGenerateColumns(false)
    .AllowSorting(Convert.ToBoolean(optionsModel.Options["Allow Sorting"].CurrentValue))
    .Bind(bl => bl.DisableServerRead(true).Bind(Model).OnClientQueryData("collectingQueryData"))
    .CssClass("grid")
    .IsReadOnly(true)
    .Columns(bl =>
    {
        bl.Add(cb => cb.Binding("ID").Visible(string.Compare(optionsModel.Options["Column Visibility"].CurrentValue, "Show", true) == 0));
        bl.Add(cb => cb.Binding("Start").Format(optionsModel.Options["Formatting"].CurrentValue == "On" ? "MMM d yy" : ""));
        bl.Add(cb => cb.Binding("End").Format(optionsModel.Options["Formatting"].CurrentValue == "On" ? "HH:mm" : ""));
        bl.Add(cb => cb.Binding("Country").Width(optionsModel.Options["Column Resize"].CurrentValue));
        bl.Add(cb => cb.Binding("Product"));
        bl.Add(cb => cb.Binding("Color"));
        bl.Add(cb => cb.Binding("Amount").Format("c"));
        bl.Add(cb => cb.Binding("Amount2").Format("c"));
        bl.Add(cb => cb.Binding("Discount").Format("p0"));
        bl.Add(cb => cb.Binding("Active"));
    })
)
 
@section Settings{
    @Html.Partial("_OptionsMenu", optionsModel)
    @Html.Partial("_FlexGridOptions", exportOptionsModel)
}
@section Description{
    @Html.Raw(Resources.MVCFlexGrid.Index_Text0)
}