Skip to content

Commit 920a1ac

Browse files
committed
docs(multiselect): various fixes
1 parent 789e6e7 commit 920a1ac

File tree

6 files changed

+35
-26
lines changed

6 files changed

+35
-26
lines changed

controls/multiselect/client-side-programming/overview.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ In addition to using the Kendo method directly, you can also use their wrappers
4444
| **dispose** |none|none|Disposes the MultiSelect client-side object (calls its underlying Kendo widget's [destroy](https://docs.telerik.com/kendo-ui/api/javascript/ui/multiselect/methods/destroy) method). Once you call it, you will not be able to use the widget or control.|
4545
| **focus** |none|none|Focuses the input.|
4646
| **get_enabled** |none|Boolean|Returns whether the control is enabled.|
47+
| **get_filter** |none|Telerik.Web.UI.RadMultiSelectFilter|Returns the filter type of the control. The possible values are *Telerik.Web.UI.RadMultiSelectFilter.StartsWith* = 0, *Telerik.Web.UI.RadMultiSelectFilter.Contains* = 1 and *Telerik.Web.UI.RadMultiSelectFilter.EndsWith* = 2.|
4748
| **get_inputElement** |none|DOM object|Returns a reference to the input element.|
4849
| **get_items** | none | Array | Returns an array of the DOM `<li>` elements, which correspond to the data items from the Kendo UI DataSource of the widget. |
4950
| **get_kendoWidget** |none|object|Returns a reference to the underlying Kendo MultiSelect widget.|
@@ -57,6 +58,7 @@ In addition to using the Kendo method directly, you can also use their wrappers
5758
| **refresh** |none|none|Refresh the popup by rendering all items again.|
5859
| **search** |string|none|Searches the data source for the provided value and displays any matches as suggestions.|
5960
| **set_enabled** |Boolean|none| Enables or disables the widget if you pass `true` or `false` respectively.|
61+
| **set_enabled** |Telerik.Web.UI.RadMultiSelectFilter|none| Sets the new filter type of the control. The possible values are *Telerik.Web.UI.RadMultiSelectFilter.StartsWith* = 0, *Telerik.Web.UI.RadMultiSelectFilter.Contains* = 1 and *Telerik.Web.UI.RadMultiSelectFilter.EndsWith* = 2.|
6062
| **set_readOnly** |Boolean|none|Sets whether the input is readonly and typing is disabled.|
6163
| **set_value** |string|none|Sets the value. See the underlying [value](https://docs.telerik.com/kendo-ui/api/javascript/ui/multiselect/configuration/value) method for more details on its behavior.|
6264
| **toggle** |none|none|Opens or closes the dropdown depending on its current state.|

controls/multiselect/data-binding/client-side.md

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -16,14 +16,15 @@ position: 1
1616
There are two ways to bind to data on the client:
1717

1818
- [Client-Side Data Binding](#client-side-data-binding)
19-
- [WebServiceSettings](#webservicesettings)
20-
- [JavaScript Object at Runtime](#javascript-object-at-runtime)
21-
- [See Also](#see-also)
19+
- [WebServiceSettings](#webservicesettings)
20+
- [JavaScript Object at Runtime](#javascript-object-at-runtime)
21+
- [See Also](#see-also)
2222

2323
## WebServiceSettings
2424

2525
Under the covers, a [Kendo UI DataSource](https://docs.telerik.com/kendo-ui/framework/datasource/overview) will be instantiated and it will perform requests to the denoted service with the settings defined in the `WebServiceSettings` tag.
26-
RadMultiSelect has an embeded RadClientDataSource control, which can be a configured through the `WebServiceClientDatasource` composite property. The widget only shows data and so only the **Select** settings and `ServiceType` are used. The rest of the settings (for Insert, Update, Delete) will not be used and are inherited from a base class.
26+
27+
RadMultiSelect has an embeded RadClientDataSource control, which can be a configured through the `WebServiceClientDatasource` composite property. The widget is designed to show data and mainly the **Select** settings and `ServiceType` are used. The rest of the settings (for Insert, Update, Delete) are inherited from the RadClientDataSource class and can be used in custom implementations.
2728

2829
>caption Example 1: Setting WebServiceClientDataSource and WebServiceSettings to bind to a web service
2930
@@ -144,7 +145,7 @@ public class Book
144145

145146
## JavaScript Object at Runtime
146147

147-
You can use the `set_dataSource()` [client-side method]({%slug multicolumncombobox/client-side-programming/overview%}) of the RadMultiSelect object to provide it with a new client-side data source. You do not have to provide a server data source or a web service for this to work, you only need to define the proper configuration (columns and fields) to match the data you will pass to the widget.
148+
You can use the `setDataSource()` of the RadMultiSelect's underlying Kendo UI widget to provide it with a new client-side data source. You do not have to provide a server data source or a web service for this to work, you only need to define the proper configuration to match the data you will pass to the widget.
148149

149150
>caption Example 3: Binding to a JavaScript array
150151

controls/multiselect/data-binding/server-side.md

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,11 @@ position: 0
1010

1111
# Server-Side Data Binding
1212

13-
**RadMultiSelect** can be bound to standard server data sources like `List<T>`, `SqlDataSource` or a `DataTable`. The data from the server data source creates MultiSelect items which are serialized as a JSON literal to the client-side. It is parsed on the client-side as the **RadMultiSelect** is a wrapper over the Kendo UI for jQuery widget which are entirely client-side.
13+
**RadMultiSelect** can be bound to standard server data sources like `List<T>`, `SqlDataSource` or a `DataTable`. The data from the server data source creates MultiSelect items which are serialized and sent to the client-side as a JSON object. It is parsed on the client-side and passed to the underlying Kendo UI MultiSelect which is an entirely client-side widget.
1414

15-
The fields that you would like to have available on the client-side should be passed to the `DataKeyNames` property, comma-separated. Also, you can add additional data to the items via the Attributes collection which will be serialized and available on the client-side.
15+
The additional fields you would like to access on the client-side should be passed to the `DataKeyNames` property, as a comma-separated string. Also, you can add custom data to the items via the `Attributes` collection which will be serialized and available on the client-side.
1616

17-
>note The DataTextField, DataValueField and the Fields declared in **RadMultiSelect** are added by default to the DataKeyNames, so it is not necessary to add them explicitly.
17+
>note The `DataTextField` and `DataValueField` are available by default on the client-side and there is no need to add them explicitly to the `DataKeyNames` collection.
1818
>
1919
2020
>caption Example 1: Declare items in the Markup
@@ -63,7 +63,7 @@ End Sub
6363
````
6464

6565

66-
>caption Example 3: Bind to an `SqlDataSource`
66+
>caption Example 3: Bind to a `SqlDataSource`
6767
6868
````ASP.NET
6969
<telerik:RadMultiSelect ID="RadMultiSelect1" runat="server"
@@ -214,5 +214,6 @@ End Function
214214
````
215215

216216
## See Also
217-
* [Get Server Text and Value]({%slug multiselect/server-side-programming/overview%}#get-selected-text-and-value)
217+
218+
* [Get Server Text and Value]({%slug multiselect/server-side-programming/overview%}#get-selected-text-and-value)
218219

controls/multiselect/functionality/tag-mode.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,16 +12,16 @@ position: 3
1212

1313
**RadMultiSelect** provides options for displaying the items as individual (multiple) tags and as a single, summary tag. The available modes are (you can see them in **Figure 1**):
1414
* `Single` - renders only one tag that shows the number of the selected values
15-
* `Multiple` - renders a tag for every selected value. This is the default tag mode.
15+
* `Multiple` - renders a tag for every selected value. This is the *default* tag mode.
1616

1717
![multiselect-tag-modes](../images/multiselect-tag-mode.gif)
1818

19-
Every `TagMode` has a specific `TagTemplate` value. You can control the content of the rendered tags by setting a custom a [TagTemplate]]({%slug multiselect/functionality/templates%}#tag-template) value.
19+
Every `TagMode` has a specific `TagTemplate` value. You can control the content of the rendered tags by customizing [TagTemplate]({%slug multiselect/functionality/templates%}#tag-template) value.
2020

2121
>caption Example 1: RadMultiSelect with single tag mode
2222
2323
````ASP.NET
24-
<telerik:RadMultiSelect ID="RadMultiSelect1" runat="server" Filter="Contains" Width="240px"
24+
<telerik:RadMultiSelect ID="RadMultiSelect1" runat="server" Filter="Contains" Width="240px"
2525
DataTextField="text" DataValueField="value" TagMode="Single">
2626
<Items>
2727
<telerik:MultiSelectItem Text="Apples" Value="1"></telerik:MultiSelectItem>

controls/multiselect/functionality/templates.md

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,14 @@ position: 1
1313
**RadMultiSelect** uses [Kendo UI Templates](https://docs.telerik.com/kendo-ui/framework/templates/overview) to provide full control over the rendering of items, selected values, and popup headers. The control supports the following templates:
1414

1515
- [Templates](#templates)
16-
- [Item template](#item-template)
17-
- [Tag Template](#tag-template)
18-
- [Header Template](#header-template)
19-
- [Footer Template](#footer-template)
20-
- [No Data Template](#no-data-template)
21-
- [Group Template](#group-template)
22-
- [See Also](#see-also)
16+
- [Item template](#item-template)
17+
- [Tag Template](#tag-template)
18+
- [Header Template](#header-template)
19+
- [Footer Template](#footer-template)
20+
- [Group Template](#group-template)
21+
- [Fixed Group Template](#fixed-group-template)
22+
- [No Data Template](#no-data-template)
23+
- [See Also](#see-also)
2324

2425
>caption Figure 1: Structure of the popup and where you can use templates.
2526
@@ -170,6 +171,10 @@ This is the [https://docs.telerik.com/kendo-ui/api/javascript/ui/multiselect/con
170171

171172
The template for the header of the group that is not the current topmost group. By default the value of the field by which the data is grouped is displayed and it is sent to the template via the `data` argument.
172173

174+
## Fixed Group Template
175+
176+
The template for the current (topmost) group. It renders just below the column headers and uses the current filter field value by default. This value is sent to the template via the `data` argument.
177+
173178
## No Data Template
174179

175180
This [template](https://docs.telerik.com/kendo-ui/api/javascript/ui/multiselect/configuration/nodatatemplate) is shown when the data source is empty or the current filter operation returned no results.

controls/multiselect/getting-started.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,23 +11,23 @@ position: 1
1111
# Getting Started
1212

1313

14-
The following tutorial demonstrates how you can add **RadMultiSelect** bound to static items collection. The end result will be similar to **Figure 1**:
14+
The following tutorial demonstrates how you can add a **RadMultiSelect** control populated with static items. The end result will be similar to **Figure 1**:
1515

1616
>caption Figure 1: Basic RadMultiSelect configuration with static items
1717
1818
![multiselect-getting-started](images/multiselect-getting-started.png)
1919

2020
1. Add a **ScriptManager** control on a Web Form.
2121

22-
1. Add a **RadMultiColumnComboBox** control to the page, and set its properties:
22+
2. Add a **RadMultiColumnComboBox** control to the page, and set its properties:
2323

24-
* `DataTextField` and `DataValueField` - set them to `text` and `value` when no datasource is used.
24+
* `DataTextField` and `DataValueField` - set them to `text` and `value` when populated with MultiSelectItems.
2525
* Populate the `Items` collection with `MultiSelectItem` instances and set their properties:
2626
* `Text` - the text of the item.
2727
* `Value` - the value of the item.
28-
* `FooterTemplate` - you can set custom footer template to the **RadMultiSelect** popup here
29-
* `Filter` - set it to "`contains`" to enable generic filtering.
30-
* Set other properties like `Placeholder`, `Height` and `Width` to control its appearance as desired.
28+
* `FooterTemplate` - you can set custom footer template to the **RadMultiSelect** popup here.
29+
* `Filter` - set it to "`Contains`" to enable generic filtering.
30+
* Set other properties like `Placeholder`, `DropDownHeight` and `Width` to control its appearance as desired.
3131

3232
The end result should be similar to the following:
3333

0 commit comments

Comments
 (0)