Extend the user entity and update the user management Blazor UI page #9479

12 Answer(s)

• 

  0

  AI-Bot created 21 days ago

  Support Team ABP Agent

  To extend the user entity and update the User Management Blazor UI page with a new column (including an autocomplete field from another entity), follow these steps:

  1. Extend the User Entity
     Use ABP's module entity extension system to add your new property (e.g., DepartmentId) to the IdentityUser entity. Map it to the database and configure it for the API/UI as needed.

  2. Add a New Column to the User Table (Blazor UI)
     Override the UserManagement component and add your new column programmatically:

     using System.Threading.Tasks;
     using Volo.Abp.AspNetCore.Components.Web.Extensibility.TableColumns;
     using Volo.Abp.DependencyInjection;
     using Volo.Abp.Identity;
     using Volo.Abp.Identity.Blazor.Pages.Identity;
     
     namespace YourNamespace.Blazor.Pages.Identity
     {
         [ExposeServices(typeof(UserManagement))]
         [Dependency(ReplaceServices = true)]
         public class CustomizedUserManagement : UserManagement
         {
             protected override async ValueTask SetTableColumnsAsync()
             {
                 await base.SetTableColumnsAsync();
                 var departmentColumn = new TableColumn
                 {
                     Title = "Department",
                     Data = "DepartmentName" // This should match your DTO property
                 };
                 TableColumns.Get<UserManagement>().Add(departmentColumn);
             }
         }
     }
     

  3. Add Autocomplete Field to the Edit/Create Modal

     • Override the user edit/create modal component.
     • Add an autocomplete (lookup) field for your new property. You can use a custom Blazor component or a third-party autocomplete component.
     • Bind the selected value to your extended property.

     Example (simplified):

     <AbpInput TItem="string" @bind-Value="SelectedDepartmentId" Label="Department" />
     <!-- Replace with your autocomplete component and logic -->
     

     In your code-behind, load the list of departments and handle selection.

  4. Map the Property in DTOs and API
     Ensure your new property is included in the relevant DTOs and mapped in the API layer so it appears in the UI and is persisted.

  5. Migration
     Add a migration and update your database to include the new column.

  ---

  References:

  • Data Table Column Extensions for Blazor UI
  • Entity Action Extensions for Blazor UI
  • Customizing Application Modules & Extending Entities

  This approach allows you to display and edit your new property (with autocomplete) directly in the user management page.

  ---

  This response was generated by AI. If it didn’t solve your problem, feel free to post a new answer — our support team will jump in to help you soon.

  Save Cancel
• 

  0

  IgorG created 21 days ago

  Where in the markup should i put it <AbpInput TItem="string" @bind-Value="SelectedDepartmentId" Label="Department" /> ?

  Save Cancel
• 

  0

  EngincanV created 21 days ago

  Support Team .NET Developer

  Hi, when you need to add new columns or extend existing module entities, the recommended approach is to use Module Entity Extensions. This method automatically includes the new columns in the DataGrid, as well as in the create and update forms.

  However, it doesn't support autocomplete functionality out of the box. From your scenario, it looks like you need an autocomplete component that can filter or search for an entity record as the user types. In this case, you'll need to implement the required changes manually.

  To do this:

  • Override the UserManagement.razor page in the identity-pro module.
  • Add your custom autocomplete component to both the edit and create models.
  • On the backend side, extend the IdentityUser entity in your application by creating a new user entity and add your custom logic accordingly.

  Regards.

  Save Cancel
• 

  0

  IgorG created 21 days ago

  [EngincanV] said: Hi, when you need to add new columns or extend existing module entities, the recommended approach is to use Module Entity Extensions. This method automatically includes the new columns in the DataGrid, as well as in the create and update forms.

  However, it doesn't support autocomplete functionality out of the box. From your scenario, it looks like you need an autocomplete component that can filter or search for an entity record as the user types. In this case, you'll need to implement the required changes manually.

  To do this:

  • Override the UserManagement.razor page in the identity-pro module.
  • Add your custom autocomplete component to both the edit and create models.
  • On the backend side, extend the IdentityUser entity in your application by creating a new user entity and add your custom logic accordingly.

  Regards.

  Override the UserManagement.razor page in the identity-pro module. - in this case i need the layout of the UserManagement.razor page. Where can i get it ?

  Save Cancel
• 

  0

  EngincanV created 21 days ago

  Support Team .NET Developer

  [IgorG] said:

  [EngincanV] said: Hi, when you need to add new columns or extend existing module entities, the recommended approach is to use Module Entity Extensions. This method automatically includes the new columns in the DataGrid, as well as in the create and update forms.

  However, it doesn't support autocomplete functionality out of the box. From your scenario, it looks like you need an autocomplete component that can filter or search for an entity record as the user types. In this case, you'll need to implement the required changes manually.

  To do this:

  • Override the UserManagement.razor page in the identity-pro module.
  • Add your custom autocomplete component to both the edit and create models.
  • On the backend side, extend the IdentityUser entity in your application by creating a new user entity and add your custom logic accordingly.

  Regards.

  Override the UserManagement.razor page in the identity-pro module. - in this case i need the layout of the UserManagement.razor page. Where can i get it ?

  Hi, you can get the source code of the identity-pro module with the following command:

  abp get-source Volo.Abp.Identity.Pro
  

  This command will install the source code of the Identity Pro module (I guess you have access?), and then you can find the UserManagement.razor in the Blazor project.

  Regards.

  Save Cancel
• 

  0

  IgorG created 20 days ago

  [EngincanV] said:

  [IgorG] said:

  [EngincanV] said:
  Hi, when you need to add new columns or extend existing module entities, the recommended approach is to use Module Entity Extensions. This method automatically includes the new columns in the DataGrid, as well as in the create and update forms.

  However, it doesn't support autocomplete functionality out of the box. From your scenario, it looks like you need an autocomplete component that can filter or search for an entity record as the user types. In this case, you'll need to implement the required changes manually.

  To do this:

  • Override the UserManagement.razor page in the identity-pro module.
  • Add your custom autocomplete component to both the edit and create models.
  • On the backend side, extend the IdentityUser entity in your application by creating a new user entity and add your custom logic accordingly.

  Regards.

  Override the UserManagement.razor page in the identity-pro module. - in this case i need the layout of the UserManagement.razor page. Where can i get it ?

  Hi, you can get the source code of the identity-pro module with the following command:

  abp get-source Volo.Abp.Identity.Pro 
  

  This command will install the source code of the Identity Pro module (I guess you have access?), and then you can find the UserManagement.razor in the Blazor project.

  Regards.

  for some reason i get an error Volo.Abp.Studio.AbpStudioException: Exception of type 'Volo.Abp.Studio.AbpStudioException' was thrown.

  i logged in using command: abp login

  Save Cancel
• 

  0

  EngincanV created 20 days ago

  Support Team .NET Developer

  [IgorG] said:

  for some reason i get an error Volo.Abp.Studio.AbpStudioException: Exception of type 'Volo.Abp.Studio.AbpStudioException' was thrown.

  i logged in using command: abp login

  What is your license type? (It should be Business or Enterprise to be able to get the source code of the module.)

  Save Cancel
• 

  0

  IgorG created 20 days ago

  [EngincanV] said:

  [IgorG] said:

  for some reason i get an error
  Volo.Abp.Studio.AbpStudioException: Exception of type
  'Volo.Abp.Studio.AbpStudioException' was thrown.

  i logged in using command: abp login

  What is your license type? (It should be Business or Enterprise to be able to get the source code of the module.)

  i have a Team license. In this case how can i get markup of the UserManagement.razor page ?

  Save Cancel
• 

  0

  EngincanV created 20 days ago

  Support Team .NET Developer

  [IgorG] said:

  [EngincanV] said:

  [IgorG] said:

  for some reason i get an error
  Volo.Abp.Studio.AbpStudioException: Exception of type
  'Volo.Abp.Studio.AbpStudioException' was thrown.

  i logged in using command: abp login

  What is your license type? (It should be Business or Enterprise to be able to get the source code of the module.)

  i have a Team license. In this case how can i get markup of the UserManagement.razor page ?

  Okay, no problem. I’ve shared the related file with you via email — please check your inbox and let me know if you need any further assistance.

  Save Cancel
• 

  0

  IgorG created 20 days ago

  [EngincanV] said:

  [IgorG] said:

  [EngincanV] said:

  [IgorG] said:

  for some reason i get an error
  Volo.Abp.Studio.AbpStudioException: Exception of type
  'Volo.Abp.Studio.AbpStudioException' was thrown.

  i logged in using command: abp login

  What is your license type? (It should be Business or Enterprise to be able to get the source code of the module.)

  i have a Team license. In this case how can i get markup of the UserManagement.razor page ?

  Okay, no problem. I’ve shared the related file with you via email — please check your inbox and let me know if you need any further assistance.

  Thank you. I see the layout. Can you also send me a code behind file ?

  Save Cancel
• 

  0

  EngincanV created 20 days ago

  Support Team .NET Developer

  [IgorG] said:

  [EngincanV] said:

  [IgorG] said:

  [EngincanV] said:

  [IgorG] said:

  for some reason i get an error
  Volo.Abp.Studio.AbpStudioException: Exception of type
  'Volo.Abp.Studio.AbpStudioException' was thrown.

  i logged in using command: abp login

  What is your license type? (It should be Business or Enterprise to be able to get the source code of the module.)

  i have a Team license. In this case how can i get markup of the UserManagement.razor page ?

  Okay, no problem. I’ve shared the related file with you via email — please check your inbox and let me know if you need any further assistance.

  Thank you. I see the layout. Can you also send me a code behind file ?

  Sure, sent it over via email.

  Save Cancel
• 

  0

  IgorG created 19 days ago

  [EngincanV] said:

  [IgorG] said:

  [EngincanV] said:

  [IgorG] said:

  [EngincanV] said:

  [IgorG] said:

  for some reason i get an error
  Volo.Abp.Studio.AbpStudioException: Exception of type
  'Volo.Abp.Studio.AbpStudioException' was thrown.

  i logged in using command: abp login

  What is your license type? (It should be Business or Enterprise to be able to get the source code of the module.)

  i have a Team license. In this case how can i get markup of the UserManagement.razor page ?

  Okay, no problem. I’ve shared the related file with you via email — please check your inbox and let me know if you need any further assistance.

  Thank you. I see the layout. Can you also send me a code behind file ?

  Sure, sent it over via email.

  Thank you. This helped me a lot

  Save Cancel

  1