Countries - Editing Code

The full code for Index.razor and Countriesaddedit.razor are shown below:

Index.razor

@page "/"
@using BlazorCountries.Data
@inject ICountriesService CountriesService
@inject NavigationManager NavigationManager

<h3>Countries List</h3>

<SfGrid @ref="FirstGrid"
        DataSource="@countries"
        AllowSorting="true"
        AllowResizing="true"
        AllowFiltering="true"
        AllowPaging="true"
        AllowReordering="true"
        AllowExcelExport="true"
        ContextMenuItems="@(new List<object>() {"AutoFit", "AutoFitAll", "SortAscending", "SortDescending","Copy", "ExcelExport", "CsvExport", "FirstPage", "PrevPage","LastPage", "NextPage"})"
        Toolbar="Toolbaritems">
    <GridPageSettings PageSize="5"></GridPageSettings>
    <GridEvents OnToolbarClick="ToolbarClickHandler" RowSelected="RowSelectHandler" TValue="Countries"></GridEvents>
    <GridColumns>
        <GridColumn Field="@nameof(Countries.CountryId)"
                    HeaderText="Country Id"
                    TextAlign="@TextAlign.Left"
                    Width="20">
        </GridColumn>
        <GridColumn Field="@nameof(Countries.CountryName)"
                    HeaderText="Country Name"
                    TextAlign="@TextAlign.Left"
                    Width="90">
        </GridColumn>
    </GridColumns>
</SfGrid>

<SfDialog @ref="DialogDelete" IsModal="true" Width="250px" ShowCloseIcon="true" Visible="false">
    <DialogTemplates>
        <Header> Confirm Delete </Header>
        <Content> Please confirm that you want to delete this record </Content>
    </DialogTemplates>
    <DialogButtons>
        <DialogButton Content="Delete" IsPrimary="true" OnClick="@ConfirmDeleteYes" />
        <DialogButton Content="Cancel" IsPrimary="false" OnClick="@ConfirmDeleteNo" />
    </DialogButtons>
</SfDialog>

<SfDialog @ref="DialogNoRecordSelected" IsModal="true" Width="250px" ShowCloseIcon="true" Visible="false">
    <DialogTemplates>
        <Header> Warning! </Header>
        <Content> You must select a country </Content>
    </DialogTemplates>
    <DialogButtons>
        <DialogButton Content="OK" IsPrimary="true" OnClick="@CloseDialogNoRecordSelected" />
    </DialogButtons>
</SfDialog>

@code {

    private SfGrid<Countries> FirstGrid;
    private List<ItemModel> Toolbaritems = new List<ItemModel>();
    private int? CountryID;
    SfDialog DialogDelete;
    SfDialog DialogNoRecordSelected;

    // Create an empty list, named countries, of empty Counties objects.
    IEnumerable<Countries> countries;

    protected override async Task OnInitializedAsync()
    {
        //Populate the list of countries objects from the Countries table.
        countries = await CountriesService.CountriesGetAll();

        Toolbaritems.Add(new ItemModel() { Text = "Add", TooltipText = "Add a new country", PrefixIcon = "e-add" });
        Toolbaritems.Add(new ItemModel() { Text = "Edit", TooltipText = "Edit selected country", PrefixIcon = "e-edit" });
        Toolbaritems.Add(new ItemModel() { Text = "Delete", TooltipText = "Delete selected country", PrefixIcon = "e-delete" });
    }

    public async Task ExcelExport()
    {
        await this.FirstGrid.ExcelExport();
    }

    public void ToolbarClickHandler(Syncfusion.Blazor.Navigations.ClickEventArgs args)
    {
        if (args.Item.Text == "Add")
        {
            CountryID = 0;
            NavigationManager.NavigateTo($"/countriesaddedit/{CountryID}");
        }
        if (args.Item.Text == "Edit")
        {
            //Check that a record has been selected
            if (CountryID > 0)
            {
                NavigationManager.NavigateTo($"/countriesaddedit/{CountryID}");
            }
            else
            {
                //No record has been selected
                DialogNoRecordSelected.Show();
            }
        }
        if (args.Item.Text == "Delete")
        {
            //Check that a record has been selected
            if (CountryID > 0)
            {
                DialogDelete.Show();
            }
            else
            {
                //No record has been selected
                DialogNoRecordSelected.Show();
            }
        }
    }

    public void RowSelectHandler(RowSelectEventArgs<Countries> args)
    {
        //{args.Data} returns the current selected records.
        CountryID = args.Data.CountryId;
    }

    public async void ConfirmDeleteNo()
    {
        await DialogDelete.Hide();
    }

    public async void ConfirmDeleteYes()
    {
        await CountriesService.CountriesDelete(CountryID.GetValueOrDefault());  //This deletes the record
        await DialogDelete.Hide();

        // Both following lines required to refresh the grid
        countries = await CountriesService.CountriesGetAll();
        CountryID = 0;      //Reset CountryID
        StateHasChanged();
    }

    private async Task CloseDialogNoRecordSelected()
    {
        await this.DialogNoRecordSelected.Hide();
    }
}

CountriesAddEdit.razor

@using BlazorCountries.Data
@page "/countriesaddedit/{CountryId:int}"
@inject ICountriesService CountriesService
@inject NavigationManager NavigationManager

<h1>@pagetitle</h1>

<SfDialog IsModal="true" Width="500px" ShowCloseIcon="false" Visible="true">

    <h5>@pagetitle</h5>
    <br />
    <EditForm Model="@countries" OnValidSubmit="@CountriesSave">
        <div>
            <SfTextBox Enabled="true" Placeholder="Country"
                       FloatLabelType="@FloatLabelType.Always"
                       @bind-Value="countries.CountryName"></SfTextBox>
        </div>
        <br /><br />
        <div class="e-footer-content">
            <div class="button-container">
                <button type="submit" class="e-btn e-normal e-primary">Save</button>
                <button type="button" class="e-btn e-normal" @onclick="@Cancel">Cancel</button>
            </div>
        </div>
    </EditForm>

</SfDialog>

@code {
    // Create a new, empty Countries object
    Countries countries = new Countries();

    [Parameter]
    public int CountryId { get; set; }

    public string pagetitle = "Add a Country";

    //Executes on page open, sets headings and gets data in the case of edit
    protected override async Task OnInitializedAsync()
    {
        if (CountryId == 0)
        {
            pagetitle = "Add a Country";
        }
        else
        {
            countries = await CountriesService.CountriesGetOne(CountryId);
            pagetitle = "Edit a Country";
        }
    }

    // Executes OnValidSubmit of EditForm above.
    protected async Task CountriesSave()
    {
        if (CountryId == 0)
        {
            await CountriesService.CountriesInsert(countries);
        }
        else
        {
            await CountriesService.CountriesUpdate(countries);
        }
        NavigationManager.NavigateTo("/");
    }

    //Executes if user clicks the Cancel button.
    void Cancel()
    {
        NavigationManager.NavigateTo("/");
    }

}