Features

Excel Export

Excel Export

The sample demonstrates how to export the contents of MultiRow control to an Microsoft Excel (xlsx) format.

Features

ID
Start
Country
Color
Amount
Amount2
Product: Gadget (53 items)
Country: German (8 items)
1
1/25/2025
German
581.61
-2,939.67
1/25/2025
Gadget
Green
0.14
4
4/25/2025
German
1,248.66
-2,815.93
4/25/2025
Gadget
Red
0.22
5
5/25/2025
German
4,051.76
-3,108.76
5/25/2025
Gadget
Black
0.12
13
1/25/2025
German
-2,446.92
-2,351.67
1/25/2025
Gadget
Red
0.12
28
4/25/2025
German
1,853.66
4,924.12
4/25/2025
Gadget
Green
0.18
31
7/25/2025
German
-165.64
-4,919.21
7/25/2025
Gadget
White
0.04
80
8/25/2025
German
2,342.70
-3,639.94
8/25/2025
Gadget
White
0.05
95
11/25/2025
German
-1,062.14
2,694.52
11/25/2025
Gadget
Green
0.05
Country: Canada (8 items)
2
2/25/2025
Canada
4,919.02
-4,673.75
2/25/2025
Gadget
Green
0.17
6
6/25/2025
Canada
-3,131.28
-4,314.81
6/25/2025
Gadget
Black
0.16
24
12/25/2025
Canada
4,917.55
-4,479.39
12/25/2025
Gadget
Red
0.14
30
6/25/2025
Canada
-3,447.73
3,738.87
6/25/2025
Gadget
Green
0.10
57
9/25/2025
Canada
-1,746.26
-780.98
9/25/2025
Gadget
Black
0.19
64
4/25/2025
Canada
-2,520.97
31.56
4/25/2025
Gadget
Red
0.09
76
4/25/2025
Canada
2,015.45
-1,489.64
4/25/2025
Gadget
White
0.25
93
9/25/2025
Canada
-4,707.05
-1,935.98
9/25/2025
Gadget
Black
0.19
Country: Japan (11 items)
3
3/25/2025
Japan
2,159.73
-3,810.42
3/25/2025
Gadget
Red
0.07
15
3/25/2025
Japan
1,089.32
-4,102.95
3/25/2025
Gadget
Green
0.16
23
11/25/2025
Japan
-4,146.76
853.06
11/25/2025
Gadget
White
0.01
26
2/25/2025
Japan
-4,257.83
-1,652.26
2/25/2025
Gadget
White
0.23
39
3/25/2025
Japan
1,493.10
391.20
3/25/2025
Gadget
Red
0.19
71
11/25/2025
Japan
4,676.20
-2,435.42
11/25/2025
Gadget
Green
0.04
73
1/25/2025
Japan
-4,916.10
-507.49
1/25/2025
Gadget
Red
0.19
77
5/25/2025
Japan
4,585
-2,963
5/25/2025
Gadget
White
0.16
88
4/25/2025
Japan
4,009.94
-3,149.85
4/25/2025
Gadget
White
0.11
89
5/25/2025
Japan
2,323.39
444.47
5/25/2025
Gadget
Red
0.16
99
3/25/2025
Japan
2,920.44
4,808.53
3/25/2025
Gadget
White
0
Country: Korea (8 items)
9
9/25/2025
Korea
-2,363.16
3,425.60
9/25/2025
Gadget
Black
0.14
25
1/25/2025
Korea
3,824.28
2,007.51
1/25/2025
Gadget
Black
0.08
35
11/25/2025
Korea
-4,563.28
1,361.51
11/25/2025
Gadget
Red
0.02
44
8/25/2025
Korea
2,170.82
-3,562.14
8/25/2025
Gadget
Green
0.14
45
9/25/2025
Korea
-3,000.98
-238.75
9/25/2025
Gadget
Red
0.09
54
6/25/2025
Korea
-3,422.65
2,304.34
6/25/2025
Gadget
Green
0.22
65
5/25/2025
Korea
3,017.71
2,732.26
5/25/2025
Gadget
White
0.12
67
7/25/2025
Korea
-3,256.14
-3,342.69
7/25/2025
Gadget
White
0
Country: China (4 items)
16
4/25/2025
China
1,341.85
532.34
4/25/2025
Gadget
Black
0.08
53
5/25/2025
China
-4,266.09
-4,920.97
5/25/2025
Gadget
Red
0.06
55
7/25/2025
China
-185.37
-280.05
7/25/2025
Gadget
Red
0.12
68
8/25/2025
China
4,334.98
-1,274.35
8/25/2025
Gadget
White
0.17
Country: France (3 items)
19
7/25/2025
France
-2,008.99
1,805.09
7/25/2025
Gadget
Green
0.09
20
8/25/2025
France
2,568.01
2,889.37
8/25/2025
Gadget
White
0.03
49
1/25/2025
France
-748.11
1,463.78
1/25/2025
Gadget
Green
0.14
Country: Italy (3 items)
27
3/25/2025
Italy
1,095.08
1,413.34
3/25/2025
Gadget
Black
0.20
51
3/25/2025
Italy
4,420.76
-4,654.08
3/25/2025
Gadget
White
0.01
90
6/25/2025
Italy
-1,227.88
1,787.36
6/25/2025
Gadget
Green
0.12
Country: US (6 items)
37
1/25/2025
US
544.13
-4,548.24
1/25/2025
Gadget
Red
0.10
46
10/25/2025
US
3,374.49
-4,629.37
10/25/2025
Gadget
Red
0.23
62
2/25/2025
US
4,568.40
2,813.06
2/25/2025
Gadget
White
0.21
82
10/25/2025
US
2,869.30
3,725.41
10/25/2025
Gadget
Green
0.12
83
11/25/2025
US
-2,190.02
-2,736.44
11/25/2025
Gadget
Black
0.18
97
1/25/2025
US
2,518.17
1,421.02
1/25/2025
Gadget
White
0.19
Country: UK (2 items)
41
5/25/2025
UK
-3,175.21
-2,650.41
5/25/2025
Gadget
Black
0.18
81
9/25/2025
UK
4,479.22
-842.31
9/25/2025
Gadget
Red
0.21
Product: Widget (47 items)
Country: China (6 items)
7
7/25/2025
China
698.62
-2,745.97
7/25/2025
Widget
Red
0.15
18
6/25/2025
China
3,232.11
305.20
6/25/2025
Widget
Green
0.24
32
8/25/2025
China
160.62
1,299.66
8/25/2025
Widget
White
0.08
52
4/25/2025
China
-4,161.96
272.81
4/25/2025
Widget
Red
0.07
69
9/25/2025
China
-989.05
-4,651.12
9/25/2025
Widget
Black
0.09
74
2/25/2025
China
-1,940.69
-2,854.91
2/25/2025
Widget
White
0
Country: US (10 items)
8
8/25/2025
US
3,464.15
1,131.58
8/25/2025
Widget
White
0.03
10
10/25/2025
US
-2,836.94
-4,283.10
10/25/2025
Widget
White
0.06
17
5/25/2025
US
3,596.33
623.80
5/25/2025
Widget
Black
0.18
40
4/25/2025
US
-2,838.54
4,241.04
4/25/2025
Widget
Black
0.14
56
8/25/2025
US
-4,675
4,759.93
8/25/2025
Widget
Red
0.09
61
1/25/2025
US
2,042.44
1,010.09
1/25/2025
Widget
Black
0.02
70
10/25/2025
US
2,673.11
-1,656.47
10/25/2025
Widget
Red
0.01
78
6/25/2025
US
1,986.58
606.61
6/25/2025
Widget
Red
0.06
79
7/25/2025
US
-3,469.64
-1,856.72
7/25/2025
Widget
Black
0.25
94
10/25/2025
US
2,301.03
1,134.37
10/25/2025
Widget
Green
0.24
Country: France (5 items)
11
11/25/2025
France
877.93
2,722.02
11/25/2025
Widget
Green
0.08
42
6/25/2025
France
22.88
-2,410.67
6/25/2025
Widget
Black
0.17
85
1/25/2025
France
-1,479.40
3,151.24
1/25/2025
Widget
Red
0.12
96
12/25/2025
France
-587.13
974.87
12/25/2025
Widget
Black
0.04
100
4/25/2025
France
568.63
329.90
4/25/2025
Widget
Green
0.13
Country: Korea (5 items)
12
12/25/2025
Korea
-3,788.14
-3,050.89
12/25/2025
Widget
Red
0.12
33
9/25/2025
Korea
-2,575.30
-1,036.23
9/25/2025
Widget
Red
0.17
43
7/25/2025
Korea
-4,129.88
-3,660.62
7/25/2025
Widget
Black
0.17
63
3/25/2025
Korea
595.84
-369.24
3/25/2025
Widget
White
0.04
66
6/25/2025
Korea
-3,412.10
3,802.04
6/25/2025
Widget
Red
0.22
Country: German (7 items)
14
2/25/2025
German
-4,374.97
-3,899.38
2/25/2025
Widget
Black
0.18
48
12/25/2025
German
-2,077.64
-4,678.39
12/25/2025
Widget
Red
0.06
50
2/25/2025
German
678.23
95.72
2/25/2025
Widget
Red
0.03
58
10/25/2025
German
-3,518.88
-2,779.71
10/25/2025
Widget
Green
0.05
72
12/25/2025
German
-4,427.85
-952.53
12/25/2025
Widget
Black
0.13
75
3/25/2025
German
-862.78
4,355.25
3/25/2025
Widget
White
0.10
91
7/25/2025
German
-456.57
2,388.73
7/25/2025
Widget
White
0.20
Country: UK (2 items)
21
9/25/2025
UK
-3,476.95
4,852.50
9/25/2025
Widget
Black
0.01
22
10/25/2025
UK
2,290.56
3,295.03
10/25/2025
Widget
Red
0.06
Country: Italy (6 items)
29
5/25/2025
Italy
3,708.86
-2,697.08
5/25/2025
Widget
White
0.03
34
10/25/2025
Italy
3,288.12
-2,392.41
10/25/2025
Widget
Red
0.19
60
12/25/2025
Italy
-839.21
1,002.81
12/25/2025
Widget
Red
0.21
84
12/25/2025
Italy
322.50
-3,277.44
12/25/2025
Widget
Black
0.23
86
2/25/2025
Italy
3,689.48
-1,072.41
2/25/2025
Widget
Black
0.10
92
8/25/2025
Italy
-992.57
-1,438.44
8/25/2025
Widget
Black
0.25
Country: Canada (5 items)
36
12/25/2025
Canada
-4,839.71
-1,835.02
12/25/2025
Widget
White
0.19
38
2/25/2025
Canada
538.45
1,848.22
2/25/2025
Widget
Red
0.04
47
11/25/2025
Canada
-2,103.52
-4,860.82
11/25/2025
Widget
Green
0.23
59
11/25/2025
Canada
-228.15
3,505.17
11/25/2025
Widget
Red
0.20
87
3/25/2025
Canada
-1,241.87
2,966.15
3/25/2025
Widget
Green
0.24
Country: Japan (1 items)
98
2/25/2025
Japan
4,900.51
3,229.92
2/25/2025
Widget
Red
0.16

Settings

Description

The sample demonstrates how to export the contents of MultiRow control to an Microsoft Excel (xlsx) format.

To export MultiRow contents, pass the MultiRow instance to the FlexGridXlsxConverter.save method. This generates xlsx file content, which can be saved to a local file or sent to a server.

Note: You should add a jszip.js library to your application. Its CDN link is: http://cdnjs.cloudflare.com/ajax/libs/jszip/2.2.1/jszip.min.js

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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
using C1.Web.Mvc.Fluent;
using C1.Web.Mvc.Grid;
using C1.Web.Mvc.MultiRow;
using C1.Web.Mvc.MultiRow.Fluent;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
 
namespace MultiRowExplorer.Models
{
    public class LayoutDefinitionsBuilders
    {
        public static Action<ListItemFactory<CellGroup, CellGroupBuilder>> OneLine
        {
            get
            {
                return ld =>
                {
                    ld.Add().Colspan(15).Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("Id").Header("ID").CssClass("id"))
                            .Add(cell => cell.Binding("Date").Header("Ordered"))
                            .Add(cell => cell.Binding("ShippedDate").Header("Shipped"))
                            .Add(cell => cell.Binding("Amount").Header("Amount").Format("c").CssClass("amount"))
                            .Add(cell => cell.Binding("Customer.Name").Name("CustomerName").Header("Customer"))
                            .Add(cell => cell.Binding("Customer.Address").Name("CustomerAddress").Header("Address"))
                            .Add(cell => cell.Binding("Customer.City").Name("CustomerCity").Header("City")
                                .DataMap(dm => { dm.DisplayMemberPath("Value").SelectedValuePath("Value").Bind(Orders.GetCities().ToValues()); }))
                            .Add(cell => cell.Binding("Customer.State").Name("CustomerState").Header("State"))
                            .Add(cell => cell.Binding("Customer.Zip").Name("CustomerZip").Header("Zip"))
                            .Add(cell => cell.Binding("Customer.Email").Name("CustomerEmail").Header("Customer Email").CssClass("email"))
                            .Add(cell => cell.Binding("Customer.Phone").Name("Customerphone").Header("Customer Phone"))
                            .Add(cell => cell.Binding("Shipper.Name").Name("ShipperName").Header("Shipper"))
                            .Add(cell => cell.Binding("Shipper.Email").Name("ShipperEmail").Header("Shipper Email").CssClass("email"))
                            .Add(cell => cell.Binding("Shipper.Phone").Name("ShipperPhone").Header("Shipper Phone"))
                            .Add(cell => cell.Binding("Shipper.Express").Name("ShipperExpress").Header("Express"));
                    });
                };
            }
        }
 
        public static Action<ListItemFactory<CellGroup, CellGroupBuilder>> TwoLines
        {
            get
            {
                return ld =>
                {
                    ld.Add().Header("Order").Colspan(2).Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("Id").Header("ID").CssClass("id").Width("150"))
                            .Add(cell => cell.Binding("Date").Header("Ordered").Width("150"))
                            .Add(cell => cell.Binding("Amount").Header("Amount").Format("c").CssClass("amount"))
                            .Add(cell => cell.Binding("ShippedDate").Header("Shipped"));
                    });
                    ld.Add().Header("Customer").Colspan(3).Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("Customer.Name").Name("CustomerName").Header("Customer").Width("200"))
                            .Add(cell => cell.Binding("Customer.Email").Name("CustomerEmail").Header("Customer Email").Colspan(2).CssClass("email"))
                            .Add(cell => cell.Binding("Customer.Address").Name("CustomerAddress").Header("Address"))
                            .Add(cell => cell.Binding("Customer.City").Name("CustomerCity").Header("City").ShowDropDown(true)
                                .DataMap(dm => { dm.DisplayMemberPath("Value").SelectedValuePath("Value").Bind(Orders.GetCities().ToValues()); }))
                            .Add(cell => cell.Binding("Customer.State").Name("CustomerState").Header("State"));
                    });
                    ld.Add().Header("Shipper").Colspan(2).Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("Shipper.Name").Name("ShipperName").Header("Shipper").Colspan(2))
                            .Add(cell => cell.Binding("Shipper.Email").Name("ShipperEmail").Header("Shipper Email").Width("200").CssClass("email"))
                            .Add(cell => cell.Binding("Shipper.Express").Name("ShipperExpress").Header("Express"));
                    });
                };
            }
        }
 
        public static Action<ListItemFactory<CellGroup, CellGroupBuilder>> ThreeLines
        {
            get
            {
                return ld =>
                {
                    ld.Add().Header("Order").Colspan(2).Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("Id").Header("ID").Colspan(2).CssClass("id"))
                            .Add(cell => cell.Binding("Amount").Header("Amount").Format("c").Colspan(2).CssClass("amount"))
                            .Add(cell => cell.Binding("Date").Header("Ordered"))
                            .Add(cell => cell.Binding("ShippedDate").Header("Shipped"));
                    });
                    ld.Add().Header("Customer").Colspan(3).Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("Customer.Name").Name("CustomerName").Header("Customer"))
                            .Add(cell => cell.Binding("Customer.Email").Name("CustomerEmail").Header("Customer Email").Colspan(2).CssClass("email"))
                            .Add(cell => cell.Binding("Customer.Address").Name("CustomerAddress").Header("Address").Colspan(2))
                            .Add(cell => cell.Binding("Customer.Phone").Name("CustomerPhone").Header("Phone"))
                            .Add(cell => cell.Binding("Customer.City").Name("CustomerCity").Header("City")
                                .DataMap(dm => { dm.DisplayMemberPath("Value").SelectedValuePath("Value").Bind(Orders.GetCities().ToValues()); }))
                            .Add(cell => cell.Binding("Customer.State").Name("CustomerState").Header("State"))
                            .Add(cell => cell.Binding("Customer.Zip").Name("CustomerZip").Header("Zip"));
                    });
                    ld.Add().Header("Shipper").Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("Shipper.Name").Name("ShipperName").Header("Shipper").Width("*"))
                            .Add(cell => cell.Binding("Shipper.Email").Name("ShipperEmail").Header("Shipper Email").CssClass("email"))
                            .Add(cell => cell.Binding("Shipper.Express").Name("ShipperExpress").Header("Express"));
                    });
                };
            }
        }
 
        public static Action<ListItemFactory<CellGroup, CellGroupBuilder>> Sales
        {
            get
            {
                return ld =>
                {
                    ld.Add().Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("ID").Header("ID"));
                        cells.Add(cell => cell.Binding("Active").Header("Active"));
                    });
                    ld.Add().Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("Start").Header("Start"));
                        cells.Add(cell => cell.Binding("End").Header("End"));
                    });
                    ld.Add().Colspan(2).Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("Country").Header("Country").Colspan(2));
                        cells.Add(cell => cell.Binding("Product").Header("Product"));
                        cells.Add(cell => cell.Binding("Color").Header("Color"));
                    });
                    ld.Add().Colspan(2).Cells(cells =>
                    {
                        cells.Add(cell => cell.Binding("Amount").Header("Amount"));
                        cells.Add(cell => cell.Binding("Amount2").Header("Amount2"));
                        cells.Add(cell => cell.Binding("Discount").Header("Discount").Colspan(2));
                    });
                };
            }
        }
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
using MultiRowExplorer.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Mvc;
 
namespace MultiRowExplorer.Controllers
{
    public partial class MultiRowController : Controller
    {
        public ActionResult ExcelExport()
        {
            return View(Sale.GetData(100));
        }
    }
}
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
55
56
57
58
59
60
61
62
63
64
65
66
@model IEnumerable<Sale>
@{
    ViewBag.DemoSettings = true;
}
 
@section Styles{
    <style>
        .checkbox-div {
            padding-left: 15px;
            display: inline-block;
            vertical-align: middle;
        }
 
            .checkbox-div .checkbox {
                display: inline-block;
                vertical-align: middle;
            }
    </style>
}
 
@section Scripts{
    <script>
        var multiRow, colHeaderCheckBox;
        c1.documentReady(function () {
            multiRow = wijmo.Control.getControl("#excelExportMultiRow");
            colHeaderCheckBox = document.getElementById("colHeaderCheckBox");
        });
 
        function exportXlsx() {
            if (multiRow) {
                wijmo.grid.xlsx.FlexGridXlsxConverter.save(multiRow, { includeCellStyles: false, includeColumnHeaders: true }, 'MultiRow.xlsx');
            }
        }
 
    </script>
}
 
@(Html.C1().MultiRow<Sale>().Id("excelExportMultiRow")
    .Bind(Model)
    .ShowGroups(true)
    .GroupBy("Product", "Country")
    .IsReadOnly(true)
    .CssClass("multirow")
    .LayoutDefinition(LayoutDefinitionsBuilders.Sales)
)
 
@section Settings{
    <div class="col-md-12 col-xs-12">
        <div class="form-inline well well-lg">
            <a download="MultiRow.xlsx" class="btn btn-default" id="exportBtn" onclick="exportXlsx();">Export</a>
        </div>
    </div>
}
@section Description{
    <p>
        The sample demonstrates how to export the contents of <b>MultiRow</b> control to an Microsoft Excel (xlsx) format.
    </p>
    <p>
        To export <b>MultiRow</b> contents, pass the <b>MultiRow</b> instance to the <b>FlexGridXlsxConverter.save</b> method.
        This generates xlsx file content, which can be saved to a local file or sent to a server.
    </p>
    <p>
        <b>Note:</b> You should add a <b>jszip.js</b> library to your application. Its CDN link is: <a href="http://cdnjs.cloudflare.com/ajax/libs/jszip/2.2.1/jszip.min.js">http://cdnjs.cloudflare.com/ajax/libs/jszip/2.2.1/jszip.min.js</a>
    </p>
}