Features
- Overview
- Collapsible Column Headers
- Styling Records, Groups, and Cells
- Grouping
- Filtering
- Row and Column Freezing
- Paging
- Group Panel
- Remote Data Binding
- Custom Cells
- Custom Editors
- Editing
- Batch Editing
- Sorting
- Virtual Scrolling
- Disable Server Reading
- Data Map
- Excel Export
- PDF Export
- Unobtrusive Validation
Filtering
Filtering
This sample shows how to use filtering in the MultiRow control.
Features
Id
ShippedDate
Customer.Name
Customer.Email
Customer.Phone
Shipper.Name
0
Sue Smith
Sue.Smith@gmail.com
Speedy Express
$849.00
5510 White St.
105-3533
speedy@gmail.com
4/4/2019
4/7/2019
Florence
RT
54796-155
1
John Bannon
John.Bannon@gmail.com
Logitrax
$1,163.00
1286 Wong St.
753-3780
logitrax@gmail.com
5/11/2018
5/12/2018
Cairo
SC
15665-651
2
Aaron Smith
Aaron.Smith@gmail.com
Logitrax
$935.00
2597 Brown St.
214-9274
logitrax@gmail.com
11/23/2017
11/26/2017
Rome
CS
85952-432
3
Paul Bannon
Paul.Bannon@gmail.com
Speedy Express
$2,617.00
9176 Johnson St.
184-7568
speedy@gmail.com
10/24/2023
10/28/2023
York
SC
94608-181
4
Brad Wong
Brad.Wong@gmail.com
Flash Delivery
$1,840.00
5722 Richards St.
497-6497
flash@gmail.com
10/29/2020
11/1/2020
Florence
RN
83619-218
5
Paul Peters
Paul.Peters@gmail.com
Speedy Express
$2,079.00
7817 White St.
435-6549
speedy@gmail.com
6/14/2018
6/18/2018
Paris
RS
13198-653
6
Mark Johnson
Mark.Johnson@gmail.com
Logitrax
$1,920.00
3624 Richards St.
232-4800
logitrax@gmail.com
2/5/2018
2/9/2018
Rome
RT
96558-139
7
Joe Wong
Joe.Wong@gmail.com
Logitrax
$1,335.00
3674 Johnson St.
556-8213
logitrax@gmail.com
6/30/2024
7/3/2024
Sidney
RN
87546-152
8
John Bannon
John.Bannon@gmail.com
Speedy Express
$3,741.00
1286 Wong St.
753-3780
speedy@gmail.com
7/24/2021
7/25/2021
Cairo
SC
15665-651
9
John Bannon
John.Bannon@gmail.com
Speedy Express
$2,642.00
7163 Wong St.
150-3760
speedy@gmail.com
2/15/2018
2/18/2018
Rome
RN
88128-230
10
Mark Richards
Mark.Richards@gmail.com
Speedy Express
$218.00
3438 Peters St.
873-1777
speedy@gmail.com
5/7/2018
5/11/2018
Rome
RN
89883-665
11
Aaron Brown
Aaron.Brown@gmail.com
Speedy Express
$3,625.00
5823 Richards St.
727-5180
speedy@gmail.com
4/21/2024
4/23/2024
Rome
CS
37344-493
12
Mark Peters
Mark.Peters@gmail.com
Speedy Express
$4,940.00
4885 Adams St.
379-1956
speedy@gmail.com
4/17/2018
4/20/2018
Hamburg
CS
13775-377
13
Tony Richards
Tony.Richards@gmail.com
Logitrax
$3,207.00
7601 White St.
564-8600
logitrax@gmail.com
7/23/2017
7/25/2017
Rome
CS
79139-709
14
Paul Brown
Paul.Brown@gmail.com
Flash Delivery
$4,191.00
1317 White St.
397-4499
flash@gmail.com
3/8/2021
3/11/2021
Sidney
CS
34497-959
15
Chris Wong
Chris.Wong@gmail.com
Flash Delivery
$4,281.00
3566 Brown St.
406-8756
flash@gmail.com
10/26/2022
10/30/2022
Cairo
RT
34925-232
16
Frank Johnson
Frank.Johnson@gmail.com
Flash Delivery
$250.00
5141 Smith St.
430-6120
flash@gmail.com
5/8/2023
5/10/2023
Cairo
RN
80126-665
17
Mark Peters
Mark.Peters@gmail.com
Logitrax
$1,581.00
4885 Adams St.
379-1956
logitrax@gmail.com
1/31/2018
2/4/2018
Hamburg
CS
13775-377
18
Chris Adams
Chris.Adams@gmail.com
Logitrax
$3,523.00
375 White St.
123-6196
logitrax@gmail.com
6/9/2018
6/13/2018
Hamburg
RS
28434-504
19
Brad Wong
Brad.Wong@gmail.com
Flash Delivery
$2,671.00
5722 Richards St.
497-6497
flash@gmail.com
12/31/2018
1/2/2019
Florence
RN
83619-218
20
Bill Richards
Bill.Richards@gmail.com
Flash Delivery
$2,010.00
3698 Brown St.
423-5973
flash@gmail.com
5/12/2020
5/16/2020
Rome
RS
98356-239
21
Paul Bannon
Paul.Bannon@gmail.com
Speedy Express
$1,421.00
9176 Johnson St.
184-7568
speedy@gmail.com
10/25/2022
10/26/2022
York
SC
94608-181
22
Sue White
Sue.White@gmail.com
Speedy Express
$3,121.00
7102 Bannon St.
699-6413
speedy@gmail.com
3/31/2023
4/2/2023
Rome
RS
24201-621
23
Paul White
Paul.White@gmail.com
Speedy Express
$4,220.00
727 Johnson St.
366-8107
speedy@gmail.com
3/8/2022
3/11/2022
York
SC
67384-802
24
Brad Wong
Brad.Wong@gmail.com
Logitrax
$2,201.00
6452 Brown St.
538-1993
logitrax@gmail.com
3/25/2025
3/29/2025
York
RT
61238-974
ID
Customer
Customer Email
Shipper
Amount
Address
Phone
Shipper Email
Ordered
Shipped
City
State
Zip
Express
Settings
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 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 | using C1.Web.Mvc; using MultiRowExplorer.Models; using System; using System.Collections.Generic; using System.Web.Mvc; using System.Linq; namespace MultiRowExplorer.Controllers { public partial class MultiRowController : Controller { private static OptionItem CreateOptionItem() { return new OptionItem { Values = new List< string > { "None" , "Condition" , "Value" , "Both" }, CurrentValue = "Both" }; } private readonly ControlOptions _filterOptions = new ControlOptions { Options = new OptionDictionary { { "CustomerState" , CreateOptionItem()}, { "CustomerCity" , CreateOptionItem()}, { "ShipperName" , CreateOptionItem()}, { "ShipperExpress" , CreateOptionItem()}, { "Amount" , CreateOptionItem()} } }; public ActionResult Filter(FormCollection data) { _filterOptions.LoadPostData(data); ViewBag.DemoOptions = _filterOptions; ViewBag.FilterTypes = GetFilterTypes(_filterOptions); return View(Orders.GetOrders()); } private Dictionary< string , FilterType> GetFilterTypes(ControlOptions controlOptions) { var filterTypes = new Dictionary< string , FilterType>(); foreach (var item in controlOptions.Options) { filterTypes.Add(item.Key, (FilterType)Enum.Parse( typeof (FilterType), item.Value.CurrentValue)); } return filterTypes; } } } |
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 | @model IEnumerable< Orders.Order > @ { ControlOptions optionsModel = ViewBag.DemoOptions; Dictionary< string , FilterType> filterTypes = ViewBag.FilterTypes; ViewBag.DemoSettings = true ; ViewBag.DemoDescription = false ; } @section Styles{ < style > label { display: inline-block; font-weight: normal; padding: 3px; } </ style > } @ (Html.C1().MultiRow< Orders.Order >() .Id( "filteringMultiRow" ) .Bind(Model) .PageSize(25) .IsReadOnly( true ) .LayoutDefinition(LayoutDefinitionsBuilders.ThreeLines) .SelectionMode(SelectionMode.Row) .AllowSorting( true ) .Filterable(f => f.DefaultFilterType(FilterType.Both) .ColumnFilters(cfsb => { foreach (var item in filterTypes) { cfsb.Add(cfb => cfb.Column(item.Key).FilterType(item.Value)); } }) ) .CssClass( "multirow" ) ) @ (Html.C1().Pager().Owner( "filteringMultiRow" )) @section Settings{ @Html .Partial( "_OptionsMenu" , optionsModel) } @section Summary{ This sample shows how to use filtering in the MultiRow control. } |