Component replacement of components inside CRUD modals #6696

7 Answer(s)

• 

  0

  maliming created one year ago

  Support Team Fullstack Developer

  hi

  https://docs.abp.io/en/commercial/latest/abp-suite/editing-templates

  Save Cancel
• 

  0

  hanakl created one year ago

  HI, I've read through documentation about editing templates prior to my post. I should have mentioned in there, sorry. The problem is that in my template called "Frontend.Blazor.Page.Item.razor.txt" is this block of code:

      <Validations @ref="@Editing%%entity-name%%Validations"
                  Mode="ValidationMode.Auto"
                  Model="@Editing%%entity-name%%"
                  ValidateOnLoad="false">
           %%main-edit-tab-opener%%
          %%razor-modal-fields-edit%%
          %%main-tab-closer%%
          %%razor-modal-navigation-connection-fields-editing%%
      </Validations>%%tab-closer%%
  

  This seems to be responsible for a generation of this code from the app:

  <Validations @ref="@NewPageValidations"
              Mode="ValidationMode.Auto"
              Model="@NewPage"
              ValidateOnLoad="false"\>
       
      
      <Validation MessageLocalizer="@LH.Localize">
          <Field>
              <FieldLabel>@L["Title"] *</FieldLabel>
              <TextEdit @bind-Text="@NewPage.Title"  >
                  <Feedback>
                      <ValidationError />
                  </Feedback>
              </TextEdit>
          </Field>
      </Validation>
  
  
      <Validation MessageLocalizer="@LH.Localize">
          <Field>
              <FieldLabel>@L["PublishAt"]</FieldLabel>
              <DateEdit TValue="DateTime?" InputMode="DateInputMode.DateTime" @bind-Date="@NewPage.PublishAt" >
                 <Feedback>
                      <ValidationError />
                  </Feedback>
              </DateEdit>
          </Field>
      </Validation>
  
  
      <Validation MessageLocalizer="@LH.Localize">
          <Field>
              <FieldLabel>@L["Content"] *</FieldLabel>
              <MemoEdit @bind-Text="@NewPage.Content"  >
                  <Feedback>
                      <ValidationError />
                  </Feedback>
              </MemoEdit>
          </Field>
      </Validation>
  
  
      <Field>
          <FieldLabel>@L["Type"]</FieldLabel>
          <Select TValue="PageType" @bind-SelectedValue="@NewPage.Type" >
              @foreach (var itemValue in Enum.GetValues(typeof(PageType)))
              {
                  <SelectItem TValue="PageType" Value="@((PageType) itemValue)">
                      @L[$"Enum:PageType.{((PageType) itemValue).ToString("d")}"]
                  </SelectItem>
              }
          </Select>
      </Field>
  
  
      
      
  </Validations>
  

  What I acknowledge is that I'm able to edit the template to the point it would generate what I want, thanks to the present if branching a looping logic, but it feels like a really impractical solution to me. What I'm confused about the most are these variables:

      %%main-edit-tab-opener%%
      %%razor-modal-fields-edit%%
      %%main-tab-closer%%
      %%razor-modal-navigation-connection-fields-editing%%
  

  Save Cancel
• 

  0

  EngincanV created one year ago

  Support Team .NET Developer

  What I acknowledge is that I'm able to edit the template to the point it would generate what I want, thanks to the present if branching a looping logic, but it feels like a really impractical solution to me. What I'm confused about the most are these variables:

      %%main-edit-tab-opener%% 
      %%razor-modal-fields-edit%% 
      %%main-tab-closer%% 
      %%razor-modal-navigation-connection-fields-editing%% 
  

  • %%main-edit-tab-opener%% -> this only creates an opening tab for the TabPanel component (<TabPanel Name="..">) on the code side.
  • %%razor-modal-fields-edit%% -> this corresponds to the related field components and you can edit the related txt files such as Field.Text.txt, Field.DateTime.txt, Frontend.Blazor.Page.Partials.Modal.Field.Numeric.txt, Frontend.Blazor.Page.Partials.Modal.Field.Bool.txt and Frontend.Blazor.Page.Partials.Modal.Field.Enum.txt
  • %%main-tab-closer%% -> This is just for the closing tag of the TabPanel component (</TabPanel>)
  • %%razor-modal-navigation-connection-fields-editing%% -> This is for navigation connections and use the field components again. (So, you can edit the related txt files like in the %%razor-modal-fields-edit%% placeholder)

  I will update the Editing Templates documentation.

  Best Regards.

  Save Cancel

  2
• 

  0

  hanakl created one year ago

  Hi, thank you very much for explanation, it is much more understandable for me now. I can see all of the field templates except the one used for TextArea. Templates in our solution are untouched.

  I also tried to manually go through most of the templates, but I have not noticed the one, which would be responsible for generation of MemoEdit component.

  Save Cancel
• 

  0

  EngincanV created one year ago

  Support Team .NET Developer

  Hi, thank you very much for explanation, it is much more understandable for me now. I can see all of the field templates except the one used for TextArea. Templates in our solution are untouched.

  I also tried to manually go through most of the templates, but I have not noticed the one, which would be responsible for generation of MemoEdit component.

  Hi, the Frontend.Blazor.Page.Partials.Modal.Field.Text.txt component is used for text areas. We replace the TextEdit component with MemoEdit on the code side. when it's marked as "textarea".

  Save Cancel
• 

  0

  hanakl created one year ago

  Hi, I see. Is there a way to change this behavior so that it is replaced with a different component?

  Save Cancel
• 

  0

  EngincanV created one year ago

  Support Team .NET Developer

  Hi, I see. Is there a way to change this behavior so that it is replaced with a different component?

  I'll create an internal issue for that, and try to implement it with 8.1.0-rc.2 or 8.1.0-rc.3.

  Save Cancel

  1