Search code examples
pythonjupyter-notebookvuetify.jsvoilaipyvuetify

ipyvuetify add event icon in select object


I would like to link to the event if you click on the icon, do you have an idea? Because if the user click on Delete icon I would like to clean all the value selected in the Select, maybe we have another way to do that.

import ipyvuetify as v

model_select =v.Select(
    color = 'blue',
    append_outer_icon='delete',
    style_='width: 600px',
    v_model= None,
    items=['Select All',
        'A',
        'B',
        'C',
        'D'
    ],
    item_color = 'blue',
    label='Hospital Name',
    attach = False,
    solo = True,
    small_chips = True,
    multiple = True,
    deletable_chips    = True,
    autofocus = True,
)

def on_click(widget, event, data):
    print(model_select.v_model)
    if 'Select All' in model_select.v_model:
        model_select.v_model = set(model_select.items) - set(['Select All'])

model_select.on_event('change', on_click)
model_select.append_outer_icon

model_select

Solution

  • The click on the delete icon can be handled with the click:append-outer event. See 'Events' under 'API' on https://v2.vuetifyjs.com/en/components/selects/