My row of 2 text areas that are added to a GridPanel, one is added correctly, the other gets added one row more

Anvil Q&A
1

What I’m trying to do: Trying to create a text area directly under existing text area

What I’ve tried and what’s not working: my code currently works, however for the first row that gets added, it unfortunately gets added one row below than what I was expecting. The next row of text areas that get added are perfectly fine and thereafter. It is just the first row that gets added.

Code Sample:

def add_experience_row(self, grid_panel):
    current_row_count = len(grid_panel.get_components())
    
    textarea_category = TextArea()
    textarea_description = TextArea()

    grid_panel.add_component(textarea_category, col_xs=0, width_xs = 3, row = current_row_count)
    grid_panel.add_component(textarea_description, col_xs=6, width_xs = 9, row = current_row_count)
    
  
  def button_add_experience_click(self, **event_args):
    """This method is called when the button is clicked"""
    button = event_args['sender']
    parent_grid = button.parent

    self.add_experience_row(parent_grid)

Clone link: Anvil | Login

2

Thanks for the clone. It’s helpful to create a minimal example that demonstrates the issue. Or if the clone can’t be made smaller then steps to reproduce really help. Especially when the example involves logging in and navigating to the relevant page.

Changing the code to be col_xs=3 should fix the issue i’m seeing,
starting 6 columns in for a width of 9 necessarily means the second text area has to wrap onto the next row

If that’s not the issue, then could you provide some more info about the issue?