Skip to content

Commit f0bf33a

Browse files
SyncfusionBuildSyncfusionBuild
authored
Merge pull request #3816 from Syncfusion-Content/hotfix/hotfix-v31.2.12
DOCINFRA-2341_merged_using_automation
2 parents 991d2df + cfa12ea commit f0bf33a

File tree

4 files changed

+111
-106
lines changed

4 files changed

+111
-106
lines changed

‎MAUI/DataGrid/FilterRow.md‎

Lines changed: 74 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,15 @@ keywords : maui datagrid, maui grid, grid maui, maui gridview, grid in maui, .ne
1010

1111
# Filter Row in MAUI DataGrid (SfDataGrid)
1212

13-
The [SfDataGrid](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.DataGrid.SfDataGrid.html) includes a built-in Filter Row designed for efficient record filtering. You can enable the FilterRow by specifying the position where it should be displayed by setting [SfDataGrid.FilterRowPosition]() property.
13+
The [SfDataGrid](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.DataGrid.SfDataGrid.html) includes a built-in Filter Row designed for efficient record filtering. You can enable the FilterRow by specifying the position where it should be displayed by setting [SfDataGrid.FilterRowPosition](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.DataGrid.SfDataGrid.html#Syncfusion_Maui_DataGrid_SfDataGrid_FilterRowPosition) property.
1414

1515
{% tabs %}
1616
{% highlight XAML %}
17-
<syncfusion:SfDataGrid x:Name="dataGrid"
18-
FilterRowPosition="FixedTop"
19-
AllowEditing="True"
20-
SelectionMode="Single"
21-
ItemsSource="{Binding OrderInfoCollection}" >
17+
<syncfusion:SfDataGrid x:Name="dataGrid"
18+
FilterRowPosition="FixedTop"
19+
AllowEditing="True"
20+
SelectionMode="Single"
21+
ItemsSource="{Binding OrderInfoCollection}" >
2222
{% endhighlight %}
2323
{% highlight c# %}
2424
this.dataGrid.FilterRowPosition = DataGridFilterRowPosition.FixedTop;
@@ -27,15 +27,15 @@ this.dataGrid.FilterRowPosition = DataGridFilterRowPosition.FixedTop;
2727

2828
<img alt="MAUI DataGrid with Filter Row" src="Images\filterrow\maui-datagrid-filterrow-basic.png" width="404" />
2929

30-
Retrieve the row index of the FilterRow using the [SfDataGrid.GetFilterRowIndex]() method.
30+
Retrieve the row index of the FilterRow using the [SfDataGrid.GetFilterRowIndex](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.DataGrid.Helper.GridIndexResolver.html#Syncfusion_Maui_DataGrid_Helper_GridIndexResolver_GetFilterRowIndex_Syncfusion_Maui_DataGrid_SfDataGrid_) method.
3131

3232
{% tabs %}
3333
{% highlight c# %}
3434
int filterRowIndex = this.dataGrid.GetFilterRowIndex();
3535
{% endhighlight %}
3636
{% endtabs %}
3737

38-
Verify if a given row index corresponds to the FilterRow by utilizing the [SfDataGrid.IsFilterRowIndex]() helper method.
38+
Verify if a given row index corresponds to the FilterRow by utilizing the [SfDataGrid.IsFilterRowIndex](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.DataGrid.Helper.GridIndexResolver.html#Syncfusion_Maui_DataGrid_Helper_GridIndexResolver_IsFilterRowIndex_Syncfusion_Maui_DataGrid_SfDataGrid_System_Int32_) helper method.
3939

4040
{% tabs %}
4141
{% highlight c# %}
@@ -51,8 +51,8 @@ The FilterRow automatically initializes editors that correspond to the underlyin
5151
{% highlight XAML %}
5252

5353
<syncfusion:DataGridTextColumn HeaderText="Customer ID"
54-
MappingName="CustomerID"
55-
FilterRowEditorType="MultiSelectComboBox"/>
54+
MappingName="CustomerID"
55+
FilterRowEditorType="MultiSelectComboBox"/>
5656

5757
{% endhighlight %}
5858
{% highlight c# %}
@@ -119,8 +119,8 @@ The FilterRowCell presents filter conditions in a dropdown menu, categorized by
119119
{% highlight XAML %}
120120

121121
<syncfusion:DataGridTextColumn HeaderText="Customer ID"
122-
MappingName="CustomerID"
123-
FilterRowOptionsVisibility="False" />
122+
MappingName="CustomerID"
123+
FilterRowOptionsVisibility="False" />
124124

125125
{% endhighlight %}
126126
{% highlight c# %}
@@ -188,7 +188,7 @@ Below are the filter conditions supported by different filter row editors in SfD
188188
<li>After or Equal</li>
189189
</ol></td>
190190
<td>For checkbox values, the <code>Equals</code> filter condition is always applied.</td>
191-
<td></td>
191+
<td>The filter condition will use either equals or not equals based on the number of selected items when filtering the list.</td>
192192
</tr>
193193
</table>
194194

@@ -198,7 +198,8 @@ Modify the default FilterRow condition for any specific column using the `DataGr
198198
{% highlight XAML %}
199199

200200
<syncfusion:DataGridNumericColumn HeaderText="Order ID"
201-
MappingName="OrderID" FilterRowCondition="LessThan"/>
201+
MappingName="OrderID"
202+
FilterRowCondition="LessThan"/>
202203

203204

204205
{% endhighlight %}
@@ -217,8 +218,8 @@ Control the inclusion of null values in filtering by configuring the `DataGridCo
217218
{% tabs %}
218219
{% highlight XAML %}
219220
<syncfusion:DataGridTextColumn HeaderText="Customer ID"
220-
MappingName="CustomerID"
221-
AllowBlankFilters="False"/>
221+
MappingName="CustomerID"
222+
AllowBlankFilters="False"/>
222223
{% endhighlight %}
223224
{% highlight c# %}
224225

@@ -246,7 +247,7 @@ this.dataGrid.Columns[0].AllowBlankFilters = true;
246247
<img alt="Filter Row with Null option in MAUI DataGrid" src="Images\filterrow\maui-datagrid-filterrow-multiselectblankfilters.png" width="404" />
247248

248249
## Instant filtering
249-
Filters are typically applied to columns upon cell navigation or pressing the Enter key. However, by setting [DataGridColumn.ImmediateUpdateColumnFilter]() to `true`, you can enable instant filtering as you type within the editor.
250+
Filters are typically applied to columns upon cell navigation or pressing the Enter key. However, by setting [DataGridColumn.ImmediateUpdateColumnFilter](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.DataGrid.DataGridColumn.html#Syncfusion_Maui_DataGrid_DataGridColumn_ImmediateUpdateColumnFilter) to `true`, you can enable instant filtering as you type within the editor.
250251
{% tabs %}
251252
{% highlight xaml %}
252253
<syncfusion:GridTextColumn MappingName="CustomerName"
@@ -266,10 +267,10 @@ While filter row cells are editable by default for record filtering, you can pre
266267
this.dataGrid.CurrentCellBeginEdit += DataGrid_CurrentCellBeginEdit;
267268

268269
private void DataGrid_CurrentCellBeginEdit(object? sender, DataGridCurrentCellBeginEditEventArgs e)
269-
{
270-
if (e?.Column?.MappingName == "CustomerID" && dataGrid.IsFilterRowIndex(e.RowColumnIndex.RowIndex))
271-
e.Cancel = true;
272-
}
270+
{
271+
if (e?.Column?.MappingName == "CustomerID" && dataGrid.IsFilterRowIndex(e.RowColumnIndex.RowIndex))
272+
e.Cancel = true;
273+
}
273274
{% endhighlight %}
274275
{% endtabs %}
275276

@@ -281,15 +282,18 @@ You can customize the basic styling of the FilterRow in SfDataGrid using the Def
281282

282283
{% tabs %}
283284
{% highlight xaml %}
284-
285-
<syncfusion:SfDataGrid.DefaultStyle>
286-
<syncfusion:DataGridStyle FilterRowFontAttributes="Bold" FilterIconHoverBackground="AliceBlue" FilterRowBackground="Yellow" FilterRowTextColor="CadetBlue" FilterRowFontSize="10" />
287-
</syncfusion:SfDataGrid.DefaultStyle>
285+
<syncfusion:SfDataGrid.DefaultStyle>
286+
<syncfusion:DataGridStyle FilterRowFontAttributes="Bold"
287+
FilterIconHoverBackground="AliceBlue"
288+
FilterRowBackground="Yellow"
289+
FilterRowTextColor="CadetBlue"
290+
FilterRowFontSize="10" />
291+
</syncfusion:SfDataGrid.DefaultStyle>
288292
{% endhighlight %}
289293
{% endtabs %}
290294

291295
### Filter row style
292-
Customize the appearance of the filter row by defining a style with TargetType [DataGridFilterRowView].
296+
Customize the appearance of the filter row by defining a style with TargetType [DataGridFilterRowView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.DataGrid.DataGridFilterRowView.html).
293297
{% tabs %}
294298
{% highlight xaml %}
295299
<ContentPage.Resources>
@@ -309,12 +313,11 @@ Further customize the filter row cell's appearance through the `FilterRowCellSty
309313
{% highlight xaml %}
310314

311315
<syncfusion:DataGridNumericColumn HeaderText="Order ID" MappingName="OrderID" >
312-
<syncfusion:DataGridNumericColumn.FilterRowCellStyle>
313-
<Style TargetType="syncfusion:DataGridFilterRowCell">
314-
<Setter Property="Background" Value="CornflowerBlue" />
315-
</Style>
316-
</syncfusion:DataGridNumericColumn.FilterRowCellStyle>
317-
</syncfusion:DataGridNumericColumn>
316+
<syncfusion:DataGridNumericColumn.FilterRowCellStyle>
317+
<Style TargetType="syncfusion:DataGridFilterRowCell">
318+
<Setter Property="Background" Value="CornflowerBlue" /> </Style>
319+
</syncfusion:DataGridNumericColumn.FilterRowCellStyle>
320+
</syncfusion:DataGridNumericColumn>
318321

319322
{% endhighlight %}
320323
{% endtabs %}
@@ -330,23 +333,25 @@ You can customize the default TextBox editor behavior by overriding `DataGridFil
330333

331334
{% tabs %}
332335
{% highlight xaml %}
333-
<syncfusion:DataGridTextColumn HeaderText="Customer ID"
334-
MappingName="CustomerID" FilterRowEditorType="CustomTextBox"/>
336+
<syncfusion:DataGridTextColumn HeaderText="Customer ID"
337+
MappingName="CustomerID"
338+
FilterRowEditorType="CustomTextBox"/>
335339
{% endhighlight %}
336340
{% highlight c# %}
337-
public MainPage()
338-
{
339-
InitializeComponent();
341+
public MainPage()
342+
{
343+
InitializeComponent();
340344

341-
this.dataGrid.FilterRowCellRenderers.Add("CustomTextBox", new CustomDataGridFilterRowTextBoxRenderer());
342-
}
345+
this.dataGrid.FilterRowCellRenderers.Add("CustomTextBox", new CustomDataGridFilterRowTextBoxRenderer());
346+
}
343347

344-
public class CustomDataGridFilterRowTextBoxRenderer : DataGridFilterRowTextBoxRenderer
348+
public class CustomDataGridFilterRowTextBoxRenderer : DataGridFilterRowTextBoxRenderer
349+
{
350+
public CustomDataGridFilterRowTextBoxRenderer(): base()
345351
{
346-
public CustomDataGridFilterRowTextBoxRenderer(): base()
347-
{
348-
}
352+
349353
}
354+
}
350355
{% endhighlight %}
351356
{% endtabs %}
352357

@@ -356,18 +361,19 @@ By default, columns support filtering multiple values using the MultiSelectCombo
356361

357362
{% tabs %}
358363
{% highlight xaml %}
359-
<syncfusion:DataGridTextColumn HeaderText="Customer ID"
360-
MappingName="CustomerID" FilterRowEditorType="CustomComboBox"/>
364+
<syncfusion:DataGridTextColumn HeaderText="Customer ID"
365+
MappingName="CustomerID"
366+
FilterRowEditorType="CustomComboBox"/>
361367
{% endhighlight %}
362368
{% highlight c# %}
363-
public MainPage()
364-
{
365-
InitializeComponent();
369+
public MainPage()
370+
{
371+
InitializeComponent();
366372

367-
this.dataGrid.FilterRowCellRenderers.Add("CustomComboBox", new CustomDataGridFilterRowComboBoxRenderer());
368-
}
373+
this.dataGrid.FilterRowCellRenderers.Add("CustomComboBox", new CustomDataGridFilterRowComboBoxRenderer());
374+
}
369375

370-
public class CustomDataGridFilterRowComboBoxRenderer : DataGridFilterRowComboBoxRenderer , INotifyPropertyChanged
376+
public class CustomDataGridFilterRowComboBoxRenderer : DataGridFilterRowComboBoxRenderer , INotifyPropertyChanged
371377
{
372378
private List<string>? numericComboBoxItems;
373379

@@ -536,32 +542,30 @@ By default, the `SfDataGrid` loads a `ComboBox` when the `FilterRow` enters edit
536542
{% tabs %}
537543
{% highlight xaml %}
538544
<syncfusion:DataGridTextColumn HeaderText="Customer ID"
539-
MappingName="CustomerID"
540-
FilterRowEditorType="MultiSelectComboBox"/>
545+
MappingName="CustomerID"
546+
FilterRowEditorType="MultiSelectComboBox"/>
541547
{% endhighlight %}
542548
{% highlight c# %}
543549

544-
dataGrid.FilterRowCellRenderers.Remove("MultiSelectComboBox");
545-
dataGrid.FilterRowCellRenderers.Add("MultiSelectComboBox", new CustomDataGridMultiSelectComboBoxRenderer());
550+
dataGrid.FilterRowCellRenderers.Remove("MultiSelectComboBox");
551+
dataGrid.FilterRowCellRenderers.Add("MultiSelectComboBox", new CustomDataGridMultiSelectComboBoxRenderer());
546552

547-
public class CustomDataGridMultiSelectComboBoxRenderer : DataGridFilterRowMultiSelectRenderer
553+
public class CustomDataGridMultiSelectComboBoxRenderer : DataGridFilterRowMultiSelectRenderer
554+
{
555+
public CustomDataGridMultiSelectComboBoxRenderer()
548556
{
557+
SupportsRenderOptimization = false;
558+
IsEditable = true;
559+
}
549560

550-
public CustomDataGridMultiSelectComboBoxRenderer()
551-
{
552-
SupportsRenderOptimization = false;
553-
IsEditable = true;
554-
}
555-
556-
557-
/// <summary>
558-
/// Initialize the filter-row display with a live MultiSelect ComboBox instead of a label.
559-
/// </summary>
560-
protected override void OnInitializeDisplayView(DataColumnBase dataColumn, SfDataGridContentView? view)
561-
{
562-
InitializeComboBoxView(dataColumn, view);
563-
}
561+
/// <summary>
562+
/// Initialize the filter-row display with a live MultiSelect ComboBox instead of a label.
563+
/// </summary>
564+
protected override void OnInitializeDisplayView(DataColumnBase dataColumn, SfDataGridContentView? view)
565+
{
566+
InitializeComboBoxView(dataColumn, view);
564567
}
568+
}
565569

566570
{% endhighlight %}
567571
{% endtabs %}

‎MAUI/DataGrid/Images/data-validation/maui-datagrid-datavalidation-errortiptemplate.gif‎

271 KB
Loading

‎MAUI/DataGrid/Images/data-validation/maui-datagrid-datavalidation-errortiptemplateselector.gif‎

218 KB
Loading

0 commit comments

Comments
 (0)