Events-MVC (example with htmx)
This commit is contained in:
@@ -0,0 +1,64 @@
|
||||
@model Events.MVC.Models.Registrations.RegistrationViewModel
|
||||
|
||||
<tr id="registration-@Model.Id">
|
||||
<td>@Model.Id</td>
|
||||
<td colspan="5">
|
||||
<form
|
||||
asp-action="Edit"
|
||||
asp-route-id="@Model.Id"
|
||||
method="post"
|
||||
hx-post="@Url.Action("Edit", "Registrations", new { id = Model.Id })"
|
||||
hx-target="#registration-@Model.Id"
|
||||
hx-swap="outerHTML">
|
||||
@Html.AntiForgeryToken()
|
||||
<input asp-for="Id" type="hidden" />
|
||||
<input asp-for="EventId" type="hidden" />
|
||||
<div asp-validation-summary="ModelOnly" class="text-danger small mb-2"></div>
|
||||
<div class="row g-2 align-items-start">
|
||||
<div class="col-md-5">
|
||||
<label asp-for="PersonId" class="form-label"></label>
|
||||
<input asp-for="PersonId" type="hidden" />
|
||||
<div class="position-relative registration-person-autocomplete">
|
||||
<input
|
||||
asp-for="PersonLookup"
|
||||
class="form-control"
|
||||
placeholder="Start typing a person's name"
|
||||
autocomplete="off"
|
||||
data-person-autocomplete
|
||||
hx-get="@Url.Action("PersonSuggestions", "Registrations")"
|
||||
hx-include="#registrations-state"
|
||||
hx-trigger="input changed delay:250ms"
|
||||
hx-target="#registration-person-suggestions-@Model.Id"
|
||||
hx-swap="innerHTML" />
|
||||
<div id="registration-person-suggestions-@Model.Id" class="list-group registration-person-suggestions"></div>
|
||||
</div>
|
||||
<span asp-validation-for="PersonId" class="text-danger small"></span>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<label asp-for="SportId" class="form-label"></label>
|
||||
<select asp-for="SportId" asp-items="Model.SportOptions" class="form-select">
|
||||
<option value="">Select a sport</option>
|
||||
</select>
|
||||
<span asp-validation-for="SportId" class="text-danger small"></span>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<label asp-for="RegisteredAt" class="form-label"></label>
|
||||
<input asp-for="RegisteredAt" class="form-control" disabled />
|
||||
</div>
|
||||
<div class="col-md-auto">
|
||||
<button type="submit" class="btn btn-sm btn-primary">Save</button>
|
||||
</div>
|
||||
<div class="col-md-auto">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-outline-secondary"
|
||||
hx-get="@Url.Action("Row", "Registrations", new { id = Model.Id, eventId = Model.EventId })"
|
||||
hx-target="#registration-@Model.Id"
|
||||
hx-swap="outerHTML">
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
Reference in New Issue
Block a user