Exception: control with ID '_12' not found

[noob-infinity]

I am creating simple App having two ElevatedButton buttons(expand and shrink) and ListView.

What I want that whenever I click on expand button , ListView get expanded with child item ( Text("test") ) , and vice versa

Expansion of ListView is working fine but not shrinking.
If I press the shrink button twice just after the exapansion ,It always throws an exception like below.

Exception in thread Thread-14 (shrink):
Traceback (most recent call last):
File "C:\Program Files\Python310\lib\threading.py", line 1009, in _bootstrap_inner
self.run()
File "C:\Program Files\Python310\lib\threading.py", line 946, in run
self._target(*self._args, **self._kwargs)
File "<pyshell#4>", line 8, in shrink
File "C:\Program Files\Python310\lib\site-packages\flet\page.py", line 195, in update
added_controls = self.__update(self)
File "C:\Program Files\Python310\lib\site-packages\flet\page.py", line 213, in __update
results = self.__conn.send_commands(self._session_id, commands).results
File "C:\Program Files\Python310\lib\site-packages\flet\connection.py", line 109, in send_commands
raise Exception(result.error)
Exception: control with ID '_12' not found

Below is my code

from flet import TextField, ListView, ListTile,Text, ElevatedButton, Row
import flet

def main(page):
  LT = ListTile()
  LT.title=Text("Test")
  LV = ListView(auto_scroll=True)

  def shrink(e):
      LV.controls.pop()
      page.update()

  def expand(e):
      LV.controls.append(LT)
      page.update()
      
  page.add(
      Row([
          ElevatedButton("expand",on_click=expand),
          ElevatedButton("shrink",on_click=shrink)
          ]),
      LV
      )
 flet.app(target=main) 

`

[ndonkoHenri]

There's a really strange behavior here.
Clicking expand several times appends the tiles normally to the list view (when printing out the controls) but only one tile is shown/made visible.
Clicking shrink once, removes the only visible tile, and clicking it some more times(to remove those still present in the listview.controls but not visible in the UI) shows the error you mentioned.
I made some updates to your code, so @FeodorFitsner could test/debug it out easily.

import flet as ft


def main(page):
    lview = ft.ListView(auto_scroll=True)
    tile = ft.ListTile(title=ft.Text("Test"))

    # lview.controls.append(tile)
    # lview.controls.append(tile)

    def shrink(e):
        print(f"Before shrink: {lview.controls=}")
        lview.controls.pop()
        page.update()
        print(f"After shrink: {lview.controls=}")

    def expand(e):
        print(f"Before expand: {lview.controls=}")
        lview.controls.append(tile)
        page.update()
        print(f"After expand: {lview.controls=}")

    page.add(
        ft.Row(
            [
                ft.ElevatedButton("expand", on_click=expand),
                ft.ElevatedButton("shrink", on_click=shrink)
            ]
        ),
        lview
    )


ft.app(target=main)

[FeodorFitsner]

This strange behaviour is called "happy clicking" or racing condition. It happens because all event handlers are running in separate threads and when you click both buttons fast enough it overlaps with previous, still running handlers. Flet page controls tree is not thread-safe. If you want a predictable behaviour use threading.Lock to synchronize access to lview.controls.

[ndonkoHenri]

Will try. But the thing is, I dont click them fast. Just normally.

[ndonkoHenri]

@FeodorFitsner, to avoid talking of the 'happy clicking' let's look/consider this simple code below. I wish to expose an issue (which you should have noticed if you ran the code I gave a while);

import flet as ft

def main(page):
    lview = ft.ListView(auto_scroll=True)
    tile = ft.ListTile(title=ft.Text("Test"))

    def expand(e):
        print(f"Just Before Addition: {lview.controls=}")
        lview.controls.append(tile)
        page.update()
        print(f"After Addition: {lview.controls=} \n")

    page.add(
        ft.Row(
            [
                ft.ElevatedButton("expand", on_click=expand),
            ]
        ),
        lview
    )


ft.app(target=main)

Let me know what you think of this strange behavior. 🙂

[noob-infinity]

For your Information I have ran the same code and UI(ListTile) is also getting added and visible.

[ndonkoHenri]

Oh. Really? 😳
But why is not showing on mine then?

Could you maybe show me a screenshot?

[noob-infinity]

Here you go.

[FeodorFitsner]

It's all happening because you are adding the same control to the page again. All controls on a page should have unique IDs. That ID is assigned when control is added to a page. When you add the same control over and over, by reference, all those references point to the same control with the same ID. A correct way is adding a new control instance every time you click the button:

import flet as ft

def main(page):
    lview = ft.ListView(auto_scroll=True)

    def expand(e):
        print(f"Just Before Addition: {lview.controls=}")
        lview.controls.append(ft.ListTile(title=ft.Text("Test")))
        page.update()
        print(f"After Addition: {lview.controls=} \n")

    page.add(
        ft.Row(
            [
                ft.ElevatedButton("expand", on_click=expand),
            ]
        ),
        lview
    )

ft.app(target=main)

[ndonkoHenri]

@noob-infinity, I really don't know why it works good on your end, and not on mine. Really strange.

It's all happening because you are adding the same control to the page again.

I also thought of that.
I get it better now. Thanks.

[noob-infinity]

@ndonkoHenri and @FeodorFitsner , Thanks for taking out your time for assisting me. I sincerely appreciate it.
I got the point and my issue resolved now.