Scribd
Upload
9 views2 pages

EditForm Modelstring

The document outlines a Blazor component for managing user data, including a form for adding and editing users with fields for ID, name, and address. It connects to a SQL database using stored procedures to add and retrieve user information. Additionally, it displays a table of users with options to edit or delete each entry.

Uploaded by

Angel Monares
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
9 views2 pages

EditForm Modelstring

The document outlines a Blazor component for managing user data, including a form for adding and editing users with fields for ID, name, and address. It connects to a SQL database using stored procedures to add and retrieve user information. Additionally, it displays a table of users with options to edit or delete each entry.

Uploaded by

Angel Monares
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

<EditForm Model ="Input" OnValidSubmit="AddUser" FormName ="edit-form"

method="post">

<div class="form-group">
<label class="form-label"> Id</label>
<InputText class="form-control" @bind-Value="[Link]"/>
</div>
<div class="form-group">
<label class="form-label"> Name</label>
<InputText class="form-control" @bind-Value="[Link]"/>
</div>
<div class="form-group">
<label class="form-label">Address</label>
<InputText class="form-control" @bind-Value="[Link]"/>
</div>

<button type="submit"> Add</button>


<button type="button" @onclick ="NewUser"> New</button>
<button type="button" @onclick="ReplaceUser"> Replace</button>
</EditForm>

<h3>Users Table</h3>
<table class="table">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Address</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
@foreach (var item in Users)
{
<tr>
<td>@[Link]</td>
<td>@[Link]</td>
<td>@[Link]</td>
<td>
<button @onclick="() => EditUser(item)">Edit</button>
<button @onclick="() => DeleteUser(item)">Delete</button>
</td>
</tr>
}
</tbody>
</table>

@code
{
private User Input { get; set; } = new();
private IEnumerable<User>? Users;

private async Task AddUser()


{
var connectionString = "Data Source=(localdb)\\MSSQLLocalDB;Initial
Catalog=Users;Integrated Security=True;Connect Timeout=60;Encrypt=True;Trust Server
Certificate=False;Application Intent=ReadWrite;Multi Subnet Failover=False";
using IDbConnection connection = new SqlConnection(connectionString);
var storedProc = "[dbo].[CreateUser]";
var parameters = new DynamicParameters();
[Link]("@Id", [Link], [Link], [Link]);
[Link]("@Name", [Link], [Link], [Link]);
[Link]("@Address", [Link], [Link], [Link]);

await [Link](storedProc, parameters, commandType:


[Link]);

storedProc = "[dbo].[GetUsers]";
Users = await [Link]<User>(storedProc, commandType:
[Link]);
}
protected override async Task OnInitializedAsync()
{
var connectionString = "Data Source=(localdb)\\MSSQLLocalDB;Initial
Catalog=Users;Integrated Security=True;Connect Timeout=60;Encrypt=True;Trust Server
Certificate=False;Application Intent=ReadWrite;Multi Subnet Failover=False";
using IDbConnection connection = new SqlConnection(connectionString);

var storedProc = "[dbo].[GetUsers]";


Users = await [Link]<User>(storedProc, commandType:
[Link]);

await [Link]();
}

You might also like