Editing

@using Rows = IzzyBlazor.Site.Examples.Table.Orders
@* Edit a row with the pencil: a dialog, with no script needed, that saves by a form post. Only the
   editable columns take a value from it: all of them but the key here, including the two that
   aren't shown. A total over 10,000 comes back as an error on its field. Add and Delete come
   from NewItem and OnDelete, and a paid order can't be deleted. *@
<DataGrid TItem="EditableOrder" Items="_orders" PageSize="5" Caption="Orders you can edit" ItemKey="o => o.Number.ToString()" QueryPrefix="edits-"
          EditMode="DataGridEditMode.Dialog" OnSave="Save" NewItem="NewOrder" OnDelete="Delete" ItemDeletable="o => o.Status != OrderStatus.Paid" Grow>
    <PropertyColumn Property="o => o.Number" Title="Order" Align="CellAlign.Start" Width="6.Rem" Editable="false" />
    <PropertyColumn Property="o => o.Customer" />
    <PropertyColumn Property="o => o.Status" />
    <PropertyColumn Property="o => o.Total" Format="C" Width="8.Rem" />
    <PropertyColumn Property="o => o.Date" Visible="false" />
    <PropertyColumn Property="o => o.Notes" Visible="false" />
</DataGrid>

@code {
    [CascadingParameter] private HttpContext? Http { get; set; }

    private List<EditableOrder> _orders = [];

    // Stands in for your database, with a copy of the rows for each visitor to this site.
    protected override void OnInitialized() => _orders = ExampleRows.For(Http, "editing", () => Rows.All
        .Select(o => new EditableOrder { Number = o.Number, Customer = o.Customer, Date = o.Date, Status = (OrderStatus)o.Status, Total = o.Total })
        .ToList());

    private void Save(DataGridSave<EditableOrder> save)
    {
        if (save.Item.Total > 10_000)
        {
            save.AddError(o => o.Total, "An order can't be over 10,000.");
            return;
        }

        // A real page would read the row from its database here.
        if (save.IsNew)
        {
            _orders.Insert(0, save.Item);
            return;
        }

        save.CopyTo(_orders.First(o => o.Number == save.Item.Number));
    }

    private EditableOrder NewOrder() => new() { Number = _orders.Max(o => o.Number) + 1, Date = DateOnly.FromDateTime(DateTime.Today) };

    private void Delete(DataGridDelete<EditableOrder> delete) => _orders.RemoveAll(o => o.Number == delete.Item.Number);
}

using System.ComponentModel.DataAnnotations;

namespace IzzyBlazor.Site.Examples.DataGrid;

// On a static page a row needs a parameterless constructor and settable properties, for the post to
// fill. The attributes make the form: [Required] marks and checks a field, and MultilineText makes
// it a text area.
public sealed class EditableOrder
{
    public int Number { get; set; }

    [Required, StringLength(60)]
    public string? Customer { get; set; }

    public DateOnly Date { get; set; }

    public OrderStatus Status { get; set; }

    [Range(0, 1_000_000)]
    public decimal Total { get; set; }

    [StringLength(200), DataType(DataType.MultilineText)]
    public string? Notes { get; set; }
}

public enum OrderStatus { Paid, Pending, Refunded, Failed }

@using Rows = IzzyBlazor.Site.Examples.Table.Orders
@* Edit where the row stands. Only the columns shown have a field; Notes keeps its value. A total over
   10,000 comes back as an error under its field. Escape cancels, and F2 starts from a cell of text. *@
<DataGrid TItem="EditableOrder" Items="_orders" PageSize="5" Caption="Orders edited in the row" ItemKey="o => o.Number.ToString()" QueryPrefix="row-"
          EditMode="DataGridEditMode.Row" OnSave="Save" NewItem="NewOrder" OnDelete="Delete" Grow>
    <PropertyColumn Property="o => o.Number" Title="Order" Align="CellAlign.Start" Width="6.Rem" Editable="false" Sortable />
    <PropertyColumn Property="o => o.Customer" Sortable />
    <PropertyColumn Property="o => o.Status" />
    <PropertyColumn Property="o => o.Date" />
    <PropertyColumn Property="o => o.Total" Format="C" Width="9.Rem" />
    <PropertyColumn Property="o => o.Notes" Visible="false" />
</DataGrid>

@code {
    [CascadingParameter] private HttpContext? Http { get; set; }

    private List<EditableOrder> _orders = [];

    // Stands in for your database, with a copy of the rows for each visitor to this site.
    protected override void OnInitialized() => _orders = ExampleRows.For(Http, "edit-in-row", () => Rows.All
        .Select(o => new EditableOrder { Number = o.Number, Customer = o.Customer, Date = o.Date, Status = (OrderStatus)o.Status, Total = o.Total, Notes = "Keeps its value" })
        .ToList());

    private void Save(DataGridSave<EditableOrder> save)
    {
        if (save.Item.Total > 10_000)
        {
            save.AddError(o => o.Total, "An order can't be over 10,000.");
            return;
        }

        if (save.IsNew)
        {
            _orders.Insert(0, save.Item);
            return;
        }

        save.CopyTo(_orders.First(o => o.Number == save.Item.Number));
    }

    private EditableOrder NewOrder() => new() { Number = _orders.Max(o => o.Number) + 1, Date = DateOnly.FromDateTime(DateTime.Today) };

    private void Delete(DataGridDelete<EditableOrder> delete) => _orders.RemoveAll(o => o.Number == delete.Item.Number);
}

using System.ComponentModel.DataAnnotations;

namespace IzzyBlazor.Site.Examples.DataGrid;

// On a static page a row needs a parameterless constructor and settable properties, for the post to
// fill. The attributes make the form: [Required] marks and checks a field, and MultilineText makes
// it a text area.
public sealed class EditableOrder
{
    public int Number { get; set; }

    [Required, StringLength(60)]
    public string? Customer { get; set; }

    public DateOnly Date { get; set; }

    public OrderStatus Status { get; set; }

    [Range(0, 1_000_000)]
    public decimal Total { get; set; }

    [StringLength(200), DataType(DataType.MultilineText)]
    public string? Notes { get; set; }
}

public enum OrderStatus { Paid, Pending, Refunded, Failed }

@using Rows = IzzyBlazor.Site.Examples.Table.Orders
@* The dialog in two columns, with Notes across both, and Status edited by a field of your own. A paid
   order's Delete stays, disabled, and says why. *@
<DataGrid TItem="EditableOrder" Items="_orders" PageSize="5" Caption="Orders in two columns" ItemKey="o => o.Number.ToString()" QueryPrefix="two-"
          EditMode="DataGridEditMode.Dialog" OnSave="Save" OnDelete="Delete" ItemDeletable="o => o.Status != OrderStatus.Paid" Grow>
    <PropertyColumn Property="o => o.Number" Title="Order" Align="CellAlign.Start" Width="6.Rem" Editable="false" />
    <PropertyColumn Property="o => o.Customer" />
    <PropertyColumn Property="o => o.Status">
        <EditTemplate>
            <SegmentedControl @bind-Value="context.Item.Status" Items="Enum.GetValues<OrderStatus>()" @attributes="context.Attributes" />
        </EditTemplate>
    </PropertyColumn>
    <PropertyColumn Property="o => o.Total" Format="C" Width="8.Rem" />
    <PropertyColumn Property="o => o.Date" Visible="false" />
    <PropertyColumn Property="o => o.Notes" Visible="false" />
    <EditLayout Columns="2" Size="DialogSize.Lg">
        <EditField Key="customer" />
        <EditField Key="status" />
        <EditField Key="total" />
        <EditField Key="date" />
        <EditField Key="notes" ColSpan="2" />
    </EditLayout>
    <ActionColumn Context="order">
        <EditAction />
        <DeleteAction DisabledReason="A paid order can't be deleted." />
    </ActionColumn>
</DataGrid>

@code {
    [CascadingParameter] private HttpContext? Http { get; set; }

    private List<EditableOrder> _orders = [];

    // Stands in for your database, with a copy of the rows for each visitor to this site.
    protected override void OnInitialized() => _orders = ExampleRows.For(Http, "two-columns", () => Rows.All
        .Select(o => new EditableOrder { Number = o.Number, Customer = o.Customer, Date = o.Date, Status = (OrderStatus)o.Status, Total = o.Total })
        .ToList());

    private void Save(DataGridSave<EditableOrder> save) => save.CopyTo(_orders.First(o => o.Number == save.Item.Number));

    private void Delete(DataGridDelete<EditableOrder> delete) => _orders.RemoveAll(o => o.Number == delete.Item.Number);
}

using System.ComponentModel.DataAnnotations;

namespace IzzyBlazor.Site.Examples.DataGrid;

// On a static page a row needs a parameterless constructor and settable properties, for the post to
// fill. The attributes make the form: [Required] marks and checks a field, and MultilineText makes
// it a text area.
public sealed class EditableOrder
{
    public int Number { get; set; }

    [Required, StringLength(60)]
    public string? Customer { get; set; }

    public DateOnly Date { get; set; }

    public OrderStatus Status { get; set; }

    [Range(0, 1_000_000)]
    public decimal Total { get; set; }

    [StringLength(200), DataType(DataType.MultilineText)]
    public string? Notes { get; set; }
}

public enum OrderStatus { Paid, Pending, Refunded, Failed }