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
John Peters
John.Peters@gmail.com
Flash Delivery
$4,905.00
9899 Wong St.
912-2489
flash@gmail.com
10/2/2023
10/6/2023
Hamburg
RT
69602-569
1
Tony Adams
Tony.Adams@gmail.com
Speedy Express
$3,437.00
8491 Wong St.
646-9074
speedy@gmail.com
5/24/2019
5/27/2019
Florence
SC
16303-405
2
Mark Adams
Mark.Adams@gmail.com
Speedy Express
$4,063.00
2513 Johnson St.
423-9997
speedy@gmail.com
6/18/2021
6/22/2021
Sidney
RN
40009-365
3
John Bannon
John.Bannon@gmail.com
Flash Delivery
$189.00
413 White St.
740-1551
flash@gmail.com
2/23/2019
2/24/2019
Florence
RN
47328-597
4
Mark Brown
Mark.Brown@gmail.com
Flash Delivery
$4,342.00
6290 Wong St.
264-8449
flash@gmail.com
10/29/2017
11/1/2017
Hamburg
CS
75689-685
5
Brad Bannon
Brad.Bannon@gmail.com
Logitrax
$3,045.00
3035 Peters St.
443-2285
logitrax@gmail.com
12/10/2020
12/13/2020
Florence
CS
60727-910
6
Mark Smith
Mark.Smith@gmail.com
Flash Delivery
$4,980.00
5020 Richards St.
303-2307
flash@gmail.com
1/5/2022
1/6/2022
York
CS
49038-598
7
Mark White
Mark.White@gmail.com
Logitrax
$1,776.00
1480 White St.
287-9768
logitrax@gmail.com
7/2/2018
7/5/2018
Cairo
RT
45976-933
8
Tom Brown
Tom.Brown@gmail.com
Logitrax
$4,481.00
6608 Brown St.
931-6074
logitrax@gmail.com
9/23/2021
9/27/2021
Paris
SC
12971-624
9
Aaron Johnson
Aaron.Johnson@gmail.com
Flash Delivery
$2,036.00
4125 Bannon St.
288-2673
flash@gmail.com
12/3/2020
12/4/2020
Hamburg
RS
31865-849
10
Aaron Smith
Aaron.Smith@gmail.com
Flash Delivery
$810.00
6907 Richards St.
475-8772
flash@gmail.com
6/21/2019
6/24/2019
Paris
RT
69449-561
11
Tony Peters
Tony.Peters@gmail.com
Logitrax
$4,833.00
2867 Brown St.
199-9379
logitrax@gmail.com
11/9/2019
11/13/2019
Sidney
RT
84917-290
12
Frank Wong
Frank.Wong@gmail.com
Logitrax
$281.00
5449 Richards St.
443-8525
logitrax@gmail.com
12/10/2024
12/11/2024
York
SC
15390-529
13
Tony Wong
Tony.Wong@gmail.com
Flash Delivery
$1,888.00
8144 Brown St.
410-4922
flash@gmail.com
2/19/2022
2/23/2022
York
CS
86275-297
14
Aaron Bannon
Aaron.Bannon@gmail.com
Speedy Express
$1,572.00
9082 Bannon St.
906-4436
speedy@gmail.com
9/16/2023
9/19/2023
Hamburg
CS
56154-324
15
Frank Wong
Frank.Wong@gmail.com
Speedy Express
$2,933.00
5449 Richards St.
443-8525
speedy@gmail.com
5/2/2024
5/5/2024
York
SC
15390-529
16
Tony Peters
Tony.Peters@gmail.com
Speedy Express
$1,508.00
2867 Brown St.
199-9379
speedy@gmail.com
5/2/2021
5/4/2021
Sidney
RT
84917-290
17
Sue Adams
Sue.Adams@gmail.com
Logitrax
$4,161.00
6996 Peters St.
571-8266
logitrax@gmail.com
5/16/2019
5/20/2019
Rome
CS
80229-760
18
Chris Bannon
Chris.Bannon@gmail.com
Logitrax
$1,512.00
5648 Bannon St.
554-2580
logitrax@gmail.com
10/1/2017
10/4/2017
Rome
RN
17043-557
19
Paul Bannon
Paul.Bannon@gmail.com
Flash Delivery
$3,854.00
7660 Wong St.
128-4125
flash@gmail.com
12/10/2022
12/14/2022
Sidney
SC
43781-262
20
Paul Johnson
Paul.Johnson@gmail.com
Flash Delivery
$4,083.00
2363 White St.
484-6706
flash@gmail.com
3/16/2020
3/19/2020
Cairo
SP
42685-886
21
Tony Peters
Tony.Peters@gmail.com
Speedy Express
$3,182.00
2867 Brown St.
199-9379
speedy@gmail.com
12/13/2024
12/15/2024
Sidney
RT
84917-290
22
Mark Peters
Mark.Peters@gmail.com
Flash Delivery
$4,149.00
2183 Adams St.
562-6261
flash@gmail.com
1/17/2025
1/19/2025
Sidney
RN
16624-542
23
Tony Peters
Tony.Peters@gmail.com
Speedy Express
$4,933.00
2867 Brown St.
199-9379
speedy@gmail.com
1/6/2019
1/10/2019
Sidney
RT
84917-290
24
Aaron Peters
Aaron.Peters@gmail.com
Flash Delivery
$1,390.00
1991 Bannon St.
210-5079
flash@gmail.com
8/17/2021
8/18/2021
York
CS
88879-602
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. } |