Scribd
Upload
3 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
3 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
You are on page 1/ 2

<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="Input.UserId"/>
</div>
<div class="form-group">
<label class="form-label"> Name</label>
<InputText class="form-control" @bind-Value="Input.UserName"/>
</div>
<div class="form-group">
<label class="form-label">Address</label>
<InputText class="form-control" @bind-Value="Input.UserAddress"/>
</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>@item.UserId</td>
<td>@item.UserName</td>
<td>@item.UserAddress</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();
parameters.Add("@Id", Input.UserId, DbType.String, ParameterDirection.Input);
parameters.Add("@Name", Input.UserName, DbType.String, ParameterDirection.Input);
parameters.Add("@Address", Input.UserAddress, DbType.String, ParameterDirection.Input);

await connection.ExecuteAsync(storedProc, parameters, commandType:


CommandType.StoredProcedure);

storedProc = "[dbo].[GetUsers]";
Users = await connection.QueryAsync<User>(storedProc, commandType:
CommandType.StoredProcedure);
}
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 connection.QueryAsync<User>(storedProc, commandType:
CommandType.StoredProcedure);

await base.OnInitializedAsync();
}

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy