0

I have an application written in Blazor Server .Net6. The reason of using Blazor Server instead of WebAssembly is because the site is holding database connections. On one of the pages has a table with many rows where the last column is an input with type of checkbox. In addition it's row has an ID in case is needed.

enter image description here

I am trying to archive two way binding, so when a checkbox is set to true, database record should be updated and the corresponding row/column change the value to True.

Can this be done in elegant way, like old school DevExpress or Telerik was doing on WPF with binding without events using ObservableCollections, or is needed to create event functions and post methods and LinQ to archive this?

View Code:

<tbody>
   @foreach (var datamodel_structure in datamodel_structureList)
   {
       <tr>
           <td><input type="checkbox" @bind=datamodel_structure.datamodel_structure_is_selected /></td>
       </tr>
   }
</tbody>

Controller Code:

[HttpGet, Route("structure/{id:int}")]
public async Task<List<DataModel_Structure_Ind>> GetDataModel_Structures(int id)
{
   return await Task.FromResult(_IDataModel.GetDataModel_Structures(id));
}

Interface Code:

public List<DataModel_Structure_Ind> GetDataModel_Structures(int id);

Service Code:

public List<DataModel_Structure_Ind> GetDataModel_Structures(int id)
{
    try
    {
        return _dbContext.DataModel_Structures_Ind
            .OrderBy(x => x.datamodel_structure_id)
            .Where(x => x.datamodel_id == id)
            .ToList();
    }
    catch
    {
        return null;
    }
}
Stavros Koureas
  • 1,126
  • 12
  • 34
  • I am not sure what you are really looking for here. If you use EFCore, you bind your object `@bind="rowObject.IsSelected"` and call `DbContext.SaveChangesAsync` when you feel it necessary. It seems enough straightforward to me. – T.Trassoudaine Jun 16 '22 at 08:58
  • Well, i don't think so because i tried already, in Blazor you have Get and Post, so this list in the screenshot is from a Get result, i do not see how the change event will be raised back to server from client. – Stavros Koureas Jun 16 '22 at 09:13
  • You are using Blazor Server or Blazor WASM? – T.Trassoudaine Jun 16 '22 at 09:15
  • You are right, i didn't specified that, i user Blazor Server which has Server and Client – Stavros Koureas Jun 16 '22 at 09:20
  • In Blazor server, when an element tracked by EFCore is modified, then calling `DbContext.SaveChangesAsync` will send the modifications to the database. If your elements in the list are tracked by EFCore then binding one of its properties on a checkbox should be enough. – T.Trassoudaine Jun 16 '22 at 09:28
  • Can you check again the question, i updated a little bit with the code i use to understand how i pass the list to the view. Is still possible to do this like this? – Stavros Koureas Jun 16 '22 at 09:36
  • I usually use razor pages for this kind of situation, so I don't really get how the list is passed from the controller to your View, and how you plan to update the value on DB. The elements must be tracked by the same instance of DbContext. Otherwise you would need to pass on the modifications to the new instance of DBContext. – T.Trassoudaine Jun 16 '22 at 10:25

1 Answers1

0

What if you made a custom checkbox component that takes the FieldName/ID as a Key and then has the Value that would reflect what the UI depicts and what the server has? The checkbox onchange event could fire off a SQL CMD to update, then after the DB has been updated you can call StateHasChanged() in the custom checkbox component to update the UI to reflect the changes.

srosy
  • 14
  • 1