Skip to content

Commit 4c09b26

Browse files
committed
Polish and refactor
1 parent c53aa77 commit 4c09b26

File tree

1 file changed

+58
-110
lines changed

1 file changed

+58
-110
lines changed

knowledge-base/grid-handle-empty-popup-footer.md

Lines changed: 58 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -36,10 +36,10 @@ This KB article also answers the following questions:
3636

3737
To hide the empty footer or utilize it by placing the custom form buttons, choose either of the following approaches:
3838

39-
* [Option 1: Display Custom Buttons in the Footer](#option-1-display-custom-buttons-in-the-footer)
40-
* [Option 2: Remove the Footer and Keep the Buttons in the FormTemplate](#option-2-remove-the-footer-and-keep-the-buttons-in-the-formtemplate)
39+
* [Display Custom Buttons in the Footer](#display-custom-buttons-in-the-footer)
40+
* [Remove the Footer and Keep the Buttons in the FormTemplate](#remove-the-footer-and-keep-the-buttons-in-the-formtemplate)
4141

42-
### Option 1: Display Custom Buttons in the Footer
42+
### Display Custom Buttons in the Footer
4343

4444
To display custom buttons in the footer and handle form submission, follow these steps:
4545

@@ -66,7 +66,7 @@ To display custom buttons in the footer and handle form submission, follow these
6666
<GridPopupEditFormSettings ButtonsLayout="@FormButtonsLayout.Stretch" Context="FormContext">
6767
<FormTemplate>
6868
@{
69-
EditItem = FormContext.Item as Person;
69+
EditItem = (Person)FormContext.Item;
7070
7171
<TelerikForm Model="@EditItem"
7272
ColumnSpacing="20px"
@@ -117,53 +117,31 @@ To display custom buttons in the footer and handle form submission, follow these
117117
"Manager", "Developer", "QA"
118118
};
119119
120-
private TelerikGrid<Person> GridRef { get; set; }
121-
private List<Person> GridData { get; set; }
122-
private Person EditItem { get; set; }
123-
private List<Person> _people;
120+
private TelerikGrid<Person>? GridRef { get; set; }
121+
private List<Person> GridData { get; set; } = new();
122+
private Person? EditItem { get; set; }
124123
125124
public class Person
126125
{
127126
public int EmployeeId { get; set; }
128-
public string Name { get; set; }
129-
public DateTime HireDate { get; set; }
130-
public string Position { get; set; }
131-
}
132-
133-
public List<Person> People
134-
{
135-
get
136-
{
137-
if (_people == null)
138-
{
139-
_people = GeneratePeople(30);
140-
}
141-
142-
return _people;
143-
}
127+
public string Name { get; set; } = string.Empty;
128+
public DateTime HireDate { get; set; } = DateTime.Today;
129+
public string Position { get; set; } = string.Empty;
144130
}
145131
146132
protected override void OnInitialized()
147133
{
148-
LoadData();
149-
}
150-
151-
private void LoadData()
152-
{
153-
GridData = GetPeople();
134+
GeneratePeople(30);
154135
}
155136
156137
private void DeleteItem(GridCommandEventArgs args)
157138
{
158-
DeletePerson(args.Item as Person);
159-
160-
LoadData();
139+
DeletePerson((Person)args.Item);
161140
}
162141
163142
private async Task OnSubmit()
164143
{
165-
166-
if (EditItem.EmployeeId != default)
144+
if (EditItem!.EmployeeId != default)
167145
{
168146
UpdatePerson(EditItem);
169147
}
@@ -173,8 +151,6 @@ To display custom buttons in the footer and handle form submission, follow these
173151
}
174152
175153
await ExitEditAsync();
176-
177-
LoadData();
178154
}
179155
180156
private async Task OnCancel()
@@ -184,69 +160,67 @@ To display custom buttons in the footer and handle form submission, follow these
184160
185161
private async Task ExitEditAsync()
186162
{
187-
var state = GridRef?.GetState();
188-
state.OriginalEditItem = null;
189-
state.EditItem = null;
190-
state.InsertedItem = null;
163+
var state = GridRef!.GetState();
164+
state.OriginalEditItem = null!;
165+
state.EditItem = null!;
166+
state.InsertedItem = null!;
191167
192-
await GridRef?.SetStateAsync(state);
168+
await GridRef!.SetStateAsync(state);
193169
}
194170
195171
#region Service Methods
196172
private List<Person> GetPeople()
197173
{
198-
return People;
174+
return GridData;
199175
}
200176
201177
private DataSourceResult GetPeople(DataSourceRequest request)
202178
{
203-
return People.ToDataSourceResult(request);
179+
return GridData.ToDataSourceResult(request);
204180
}
205181
206182
private void DeletePerson(Person person)
207183
{
208-
People.Remove(person);
184+
GridData.Remove(person);
209185
}
210186
211187
private void UpdatePerson(Person person)
212188
{
213-
var index = People.FindIndex(i => i.EmployeeId == person.EmployeeId);
189+
var index = GridData.FindIndex(i => i.EmployeeId == person.EmployeeId);
214190
if (index != -1)
215191
{
216-
People[index] = person;
192+
GridData[index] = person;
217193
}
218194
}
219195
220196
private void CreatePerson(Person person)
221197
{
222-
person.EmployeeId = People.Max(x => x.EmployeeId) + 1;
198+
person.EmployeeId = GridData.Max(x => x.EmployeeId) + 1;
223199
224-
People.Insert(0, person);
200+
GridData.Insert(0, person);
225201
}
226202
227-
private List<Person> GeneratePeople(int count, int startIndex = 0)
203+
private void GeneratePeople(int count, int startIndex = 1)
228204
{
229-
List<Person> result = new List<Person>();
205+
GridData = new();
230206
231-
for (int i = startIndex; i < startIndex + count; i++)
207+
for (int i = startIndex; i <= startIndex + count; i++)
232208
{
233-
result.Add(new Person()
209+
GridData.Add(new Person()
234210
{
235211
EmployeeId = i,
236212
Name = "Employee " + i.ToString(),
237213
HireDate = new DateTime(2020, 6, 1).Date.AddDays(count - (i % 7)),
238-
Position = i % 3 <= 2 ? PositionsData[i % 3] : PositionsData.FirstOrDefault()
214+
Position = i % 3 <= 2 ? PositionsData[i % 3] : PositionsData.First()
239215
240216
});
241217
}
242-
243-
return result;
244218
}
245219
#endregion
246220
}
247221
````
248222

249-
### Option 2: Remove the Footer and Keep the Buttons in the FormTemplate
223+
### Remove the Footer and Keep the Buttons in the FormTemplate
250224

251225
This approach relies on using CSS to hide the empty footer. Add your custom class to the edit popup of the Grid to override its default styling.
252226

@@ -276,7 +250,7 @@ This approach relies on using CSS to hide the empty footer. Add your custom clas
276250
<GridPopupEditFormSettings Context="FormContext">
277251
<FormTemplate>
278252
@{
279-
EditItem = FormContext.Item as Person;
253+
EditItem = (Person)FormContext.Item;
280254
281255
<TelerikForm Model="@EditItem"
282256
ColumnSpacing="20px"
@@ -325,53 +299,31 @@ This approach relies on using CSS to hide the empty footer. Add your custom clas
325299
"Manager", "Developer", "QA"
326300
};
327301
328-
private TelerikGrid<Person> GridRef { get; set; }
329-
private List<Person> GridData { get; set; }
330-
private Person EditItem { get; set; }
331-
private List<Person> _people;
302+
private TelerikGrid<Person>? GridRef { get; set; }
303+
private List<Person> GridData { get; set; } = new();
304+
private Person? EditItem { get; set; }
332305
333306
public class Person
334307
{
335308
public int EmployeeId { get; set; }
336-
public string Name { get; set; }
337-
public DateTime HireDate { get; set; }
338-
public string Position { get; set; }
339-
}
340-
341-
public List<Person> People
342-
{
343-
get
344-
{
345-
if (_people == null)
346-
{
347-
_people = GeneratePeople(30);
348-
}
349-
350-
return _people;
351-
}
309+
public string Name { get; set; } = string.Empty;
310+
public DateTime HireDate { get; set; } = DateTime.Today;
311+
public string Position { get; set; } = string.Empty;
352312
}
353313
354314
protected override void OnInitialized()
355315
{
356-
LoadData();
357-
}
358-
359-
private void LoadData()
360-
{
361-
GridData = GetPeople();
316+
GeneratePeople(30);
362317
}
363318
364319
private void DeleteItem(GridCommandEventArgs args)
365320
{
366-
DeletePerson(args.Item as Person);
367-
368-
LoadData();
321+
DeletePerson((Person)args.Item);
369322
}
370323
371324
private async Task OnValidSubmit()
372325
{
373-
374-
if (EditItem.EmployeeId != default)
326+
if (EditItem!.EmployeeId != default)
375327
{
376328
UpdatePerson(EditItem);
377329
}
@@ -381,8 +333,6 @@ This approach relies on using CSS to hide the empty footer. Add your custom clas
381333
}
382334
383335
await ExitEditAsync();
384-
385-
LoadData();
386336
}
387337
388338
private async Task OnCancel()
@@ -392,63 +342,61 @@ This approach relies on using CSS to hide the empty footer. Add your custom clas
392342
393343
private async Task ExitEditAsync()
394344
{
395-
var state = GridRef?.GetState();
396-
state.OriginalEditItem = null;
397-
state.EditItem = null;
398-
state.InsertedItem = null;
345+
var state = GridRef!.GetState();
346+
state.OriginalEditItem = null!;
347+
state.EditItem = null!;
348+
state.InsertedItem = null!;
399349
400-
await GridRef?.SetStateAsync(state);
350+
await GridRef!.SetStateAsync(state);
401351
}
402352
403353
#region Service Methods
404354
private List<Person> GetPeople()
405355
{
406-
return People;
356+
return GridData;
407357
}
408358
409359
private DataSourceResult GetPeople(DataSourceRequest request)
410360
{
411-
return People.ToDataSourceResult(request);
361+
return GridData.ToDataSourceResult(request);
412362
}
413363
414364
private void DeletePerson(Person person)
415365
{
416-
People.Remove(person);
366+
GridData.Remove(person);
417367
}
418368
419369
private void UpdatePerson(Person person)
420370
{
421-
var index = People.FindIndex(i => i.EmployeeId == person.EmployeeId);
371+
var index = GridData.FindIndex(i => i.EmployeeId == person.EmployeeId);
422372
if (index != -1)
423373
{
424-
People[index] = person;
374+
GridData[index] = person;
425375
}
426376
}
427377
428378
private void CreatePerson(Person person)
429379
{
430-
person.EmployeeId = People.Max(x => x.EmployeeId) + 1;
380+
person.EmployeeId = GridData.Max(x => x.EmployeeId) + 1;
431381
432-
People.Insert(0, person);
382+
GridData.Insert(0, person);
433383
}
434384
435-
private List<Person> GeneratePeople(int count, int startIndex = 0)
385+
private void GeneratePeople(int count)
436386
{
437-
List<Person> result = new List<Person>();
387+
GridData = new();
438388
439-
for (int i = startIndex; i < startIndex + count; i++)
389+
for (int i = 1; i <= count; i++)
440390
{
441-
result.Add(new Person()
391+
GridData.Add(new Person()
442392
{
443393
EmployeeId = i,
444394
Name = "Employee " + i.ToString(),
445395
HireDate = new DateTime(2020, 6, 1).Date.AddDays(count - (i % 7)),
446-
Position = i % 3 <= 2 ? PositionsData[i % 3] : PositionsData.FirstOrDefault()
396+
Position = i % 3 <= 2 ? PositionsData[i % 3] : PositionsData.First()
447397
448398
});
449399
}
450-
451-
return result;
452400
}
453401
#endregion
454402
}

0 commit comments

Comments
 (0)