locked
Update Not Working In Blazor RRS feed

  • Question

  • User2041008840 posted

    Hello, 
    I want to Update the column but its not working. I called asp.net core webapi into blazor server app but its not updating please see my code

    Edit.razor

    @page "/Departments/Edit/{ID:int}"
    @using HRManagementWeb.Services
    @using HRManagementLibrary.Models
    @inject NavigationManager NavigationManager
    @inject DepartmentsService departmentsService
    <h1>Edit</h1>
    
    <h4>Departments</h4>
    <hr />
    <div class="row">
        <div class="col-md-4">
    
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <input type="text" @bind="@department.ID" />
            <div class="form-group">
                <label class="control-label"></label>
                <input class="form-control" @bind="@department.Name" />
                <span class="text-danger"></span>
            </div>
            <div class="form-group">
                <a href="/departments" class="btn btn-link">Cancel</a>
                <button value="Update" @onclick="Update" class="btn btn-primary">Save</button>
            </div>
    
        </div>
    </div>
    @code {
        string Name;
        [Parameter]
        public int ID { get; set; }
        Department department = new Department();
    
        protected override async Task OnInitializedAsync()
        {
            await load();
        }
    
        protected async Task load()
        {
            department = await departmentsService.GetDepartmentsByIdAsync(ID);
            // Name = department.Name;
            //  ID = department.ID;
    
        }
    
        protected async Task Update()
        {
            // await load();
    
            Department d = new Department()
            {
                Name = Name
            };
    
    
            await departmentsService.UpdateDepartmentsAsync(department.ID, d);
            NavigationManager.NavigateTo(nameof(Departments));
            //await load();
            //mode = MODE.None;
        }
    }
    

    DepartmentService.cs

    readonly string baseUrl = "https://localhost:44384/";
    
            public async Task<Department[]> GetDepartmentsAsync()
            {
                HttpClient http = new HttpClient();
                var json = await http.GetStringAsync($"{baseUrl}api/Departments");
                return JsonConvert.DeserializeObject<Department[]>(json);
            }
    
            public async Task<Department> GetDepartmentsByIdAsync(int id)
            {
                HttpClient http = new HttpClient();
                var json = await http.GetStringAsync($"{baseUrl}api/Departments/{id}");
                return JsonConvert.DeserializeObject<Department>(json);
            }
    public async Task<HttpResponseMessage> UpdateDepartmentsAsync(int id, Department Departments)
            {
                var client = new HttpClient();
                return await client.PutAsync($"{baseUrl}api/Departments/{id}", getStringContentFromObject(Departments));
            }
       private StringContent getStringContentFromObject(object obj)
            {
                var serialized = JsonConvert.SerializeObject(obj);
                var stringContent = new StringContent(serialized, Encoding.UTF8, "application/json");
                return stringContent;
            }

    Wednesday, March 11, 2020 1:04 PM

Answers

  • User288213138 posted

    Hi Prathamesh,

    Prathamesh Shende

    I want to Update the column but its not working. I called asp.net core webapi into blazor server app but its not updating please see my code

    Please set breakpoints to check if you pass the changed data to backend successfully.

    Here is a working demo like below:

    1.Edit.razor:
    <h1>Edit</h1>
    
    <h4>Departments</h4>
    <hr />
    <div class="row">
        <div class="col-md-4">
    
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <input type="text" @bind="@department.ID" />
            <div class="form-group">
                <label class="control-label"></label>
                <input class="form-control" @bind="@department.Name" />
                <span class="text-danger"></span>
            </div>
            <div class="form-group">
                <a href="/departments" class="btn btn-link">Cancel</a>
                <button value="Update" @onclick="Update" class="btn btn-primary">Save</button>
            </div>
    
        </div>
    </div>
    @code {
        string Name;
        [Parameter]
        public int ID { get; set; }
        Department department = new Department();
    
        protected override async Task OnInitializedAsync()
        {
            await load();
        }
    
        protected async Task load()
        {
            department = await departmentsService.GetDepartmentsByIdAsync(ID);
        }
    
        protected async Task Update()
        {
    
            await departmentsService.UpdateDepartmentsAsync(department.ID, department);
            await load();
        }
    }
    
    2.WebApi:
    [Route("api/[controller]")]
    [ApiController]
    public class DepartmentsController : ControllerBase
    {
        private readonly WebApi3_1Context _context;
    
        public DepartmentsController(WebApi3_1Context context)
        {
            _context = context;
        }
        [HttpPut("{id}")]
        public async Task<IActionResult> PutDepartment(int id, Department department)
        {
            if (id != department.ID)
            {
                return BadRequest();
            }
            _context.Entry(department).State = EntityState.Modified;
    
            try
            {
                await _context.SaveChangesAsync();
            }
            catch (DbUpdateConcurrencyException)
            {               
                throw;
            }
            return NoContent();
        }
    }
    

    The result:

    Best regards,

    Sam

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, March 12, 2020 8:05 AM