forked from syncfusion/ej2-aspnetmvc-samples
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathGroupingWithCheckBox.cshtml
48 lines (46 loc) · 2.31 KB
/
GroupingWithCheckBox.cshtml
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
@using Syncfusion.EJ2
@using EJ2MVCSampleBrowser.Models
@using Syncfusion.EJ2.DropDowns
@section ControlsSection{
<div class="control-section">
<div class="control-wrapper">
<h4>Grouping with CheckBox</h4>
@Html.EJS().MultiSelect("group").PopupHeight("200px").Placeholder("Select vegetables").Mode(VisualMode.CheckBox).AllowFiltering(true).ShowSelectAll(true).FilterBarPlaceholder("Search Vegetables").EnableGroupCheckBox(true).DataSource(
(IEnumerable<Vegetables>)ViewBag.data).Fields(new MultiSelectFieldSettings { GroupBy = "Category", Text = "Vegetable", Value = "Id" }).EnableSelectionOrder(false).Render()
</div>
</div>
<link href="../Content/multiselect/grouping.css" rel="stylesheet" />
<style>
.control-fluid, .container-fluid {
padding-right: 15px;
padding-left: 15px;
}
</style>
}
@section Meta{
<meta name="description" content="This example demonstrates the Grouping with CheckBox in ASP.NET MVC MultiSelect Dropdown control. Explore here for more details."/>
}
@section ActionDescription{
<div id="action-description">
<p>
This sample demonstrates the grouping functionalities of the MultiSelect in checkbox mode. Clicking the checkbox in group will select all the items grouped under it. Click the MultiSelect element and then type
the character in the search box. It will display the filtered list items based on the typed characters and then select
the multiple values through the checkbox.
</p>
</div>
}
@section Description{
<div id="description">
<p>
The MultiSelect has built-in support to select the multiple values through the checkbox, when the <code>mode</code> property
is set to <code>CheckBox</code>. To perform the checkbox feature in MultiSelect, the <code>CheckBoxSelection</code> module
should be injected in the application end.
</p>
</div>
}
@section Title{
<title>ASP.NET MVC MultiSelect Dropdown Grouping with CheckBox Example - Syncfusion Demos </title>
}
@section Header{
<h1 class='sb-sample-text'>Example of Grouping with CheckBox in ASP.NET MVC MultiSelect Dropdown Control</h1>
}