Skip to content

Commit 9c26dc6

Browse files
committed
docs: update readme
1 parent d4f94b6 commit 9c26dc6

File tree

1 file changed

+32
-11
lines changed

1 file changed

+32
-11
lines changed

README.md

Lines changed: 32 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -64,15 +64,36 @@ In your `App.razor` or layout file, include one of the available themes:
6464
6565
columns = new List<ColumnConfiguration<Employee>>
6666
{
67-
new() { Key = "Id", HeaderText = "ID", Width = "100px", Type = DataType.Number },
68-
new() { Key = "Name", HeaderText = "Employee Name", Type = DataType.String },
69-
new() { Key = "Department", HeaderText = "Department", Type = DataType.String },
70-
new() { Key = "Salary", HeaderText = "Salary", Width = "150px", Type = DataType.Number }
67+
new() { Key = nameof(Employee.Id), HeaderText = "ID", Width = "100px", Type = DataType.Number },
68+
new() { Key = nameof(Employee.Name), HeaderText = "Employee Name", Type = DataType.String },
69+
new() { Key = nameof(Employee.Department), HeaderText = "Department", Type = DataType.String },
70+
new() { Key = nameof(Employee.Salary), HeaderText = "Salary", Width = "150px", Type = DataType.Number }
7171
};
7272
}
7373
}
7474
```
7575

76+
### With Initial Sort and Filter
77+
78+
```razor
79+
<IgbGridLite Data="@employees"
80+
Columns="@columns"
81+
SortExpressions="@initialSort"
82+
FilterExpressions="@initialFilter" />
83+
84+
@code {
85+
private List<SortExpression> initialSort = new()
86+
{
87+
new() { Key = nameof(Employee.Name), Direction = GridLiteSortingDirection.Ascending }
88+
};
89+
90+
private List<FilterExpression> initialFilter = new()
91+
{
92+
new() { Key = nameof(Employee.Department), Condition = "contains", SearchTerm = "Sales" }
93+
};
94+
}
95+
```
96+
7697
## Advanced Configuration
7798

7899
### Sorting
@@ -82,7 +103,7 @@ Enable sorting on specific columns:
82103
```csharp
83104
new ColumnConfiguration<Employee>
84105
{
85-
Key = "Name",
106+
Key = nameof(Employee.Name),
86107
HeaderText = "Name",
87108
Resizable = true,
88109
Sort = true // Enable sorting
@@ -96,7 +117,7 @@ Enable filtering on columns:
96117
```csharp
97118
new ColumnConfiguration<Employee>
98119
{
99-
Key = "Department",
120+
Key = nameof(Employee.Department),
100121
HeaderText = "Department",
101122
Filter = new ColumnFilterConfiguration
102123
{
@@ -118,22 +139,22 @@ Handle sorting and filtering events:
118139
OnFiltered="@HandleFiltered" />
119140
120141
@code {
121-
private void HandleSorting(IgbGridLiteSortingEvent<Employee> e)
142+
private void HandleSorting(IgbGridLiteSortingEvent e)
122143
{
123144
// Handle on sorting
124145
}
125146
126-
private void HandleSorted(IgbGridLiteSortedEvent<NwindDataItem> e)
147+
private void HandleSorted(IgbGridLiteSortedEvent e)
127148
{
128149
// Handle after sort
129150
}
130151
131-
private void HandleFiltering(IgbGridLiteFilteringEvent<NwindDataItem> e)
152+
private void HandleFiltering(IgbGridLiteFilteringEvent e)
132153
{
133154
// Handle on filtering
134155
}
135156
136-
private void HandleFiltered(IgbGridLiteFilteredEvent<NwindDataItem> e)
157+
private void HandleFiltered(IgbGridLiteFilteredEvent e)
137158
{
138159
// Handle after filter
139160
}
@@ -144,7 +165,7 @@ Handle sorting and filtering events:
144165

145166
The `ColumnConfiguration<TItem>` class supports:
146167

147-
- `Key`: Property name to bind to
168+
- `Key`: Property name to bind to (use `nameof()` for type safety)
148169
- `HeaderText`: Column header display text
149170
- `Width`: Column width (CSS value)
150171
- `Type`: Data type (String, Number, Boolean, Date)

0 commit comments

Comments
 (0)