Hi! I’m trying to create a search tool using rx.select component. The idea is to first select a country, and based on that, select a location (province).
I created a def select_field to create all the selects in my app (not only these ones):
Here is the code:
def select_field(
name: str,
label: str,
options: List[Dict[str, str]],
root_value: str,
placeholder: Optional[str] = None,
on_change: Optional[Callable] = None,
default: Optional[str] = None,
# required: bool = False,
is_disabled: bool = False,
) → rx.Component:
“”“Campo de selección.”“”
print(“options”)
print(options)
return rx.vstack(
rx.text(label, as_=“label”, for_=name),
rx.select.root(
rx.select.trigger(placeholder=placeholder, radius=“large”),
rx.select.content(
rx.select.group(
rx.select.label(label),
rx.select.separator(),
rx.foreach(
options,
lambda option: rx.select.item(
option.name, value=str(option.id)
),
),
),
variant=“soft”,
),
placeholder=placeholder,
name=name,
# required=required,
disabled=is_disabled,
on_change=on_change,
value=root_value,
default_value=default,
),
align_items=“start”,
)
My problems:
1 How to send the selected value through the “on_change” event trigger? I tried calling functions and computed vars without success. The idea is to get the selected country to then create the options for the province select component.
2 A trivial one: the placeholder nevers shows.
Here’s an example when I call the def select_field:
select_field(
name="pais",
label="Países",
options=ContactState.pais,
root_value=ContactState.pais_filter,
placeholder="Seleccione el País",
on_change=ContactState.handle_pais_change, ## tried using on_change=ContactState.set_pais_filter without success
is_disabled=False,
),
ContactState.pais_filter is variable defined as
pais_filter: Optional[str] = “1”
ContactState.handle_pais_change is
@rx.event
def handle_pais_change(self, pais):
“”“Maneja el cambio de país.”“”
self.pais_filter = pais
print(self.pais_filter)
Version 0.6.6
Thanks in advance and Merry Christmas!