Skip to content

File Input

A user input component that allows users to upload files.

Fields

NameTypeDescriptionOptions
LabelText
Allow multiple filesText
  • Yes
  • No
Custom CSS classesTextCSS classes, separated by spaces. You can define classes in custom stylesheets.

Events

NameDescriptionUsage
ss-file-changeCapture changes to this control.
def onchange_handler(state, payload):

  # An array of dictionaries is provided in the payload
  # The dictionaries have the properties name, type and data
    # The data property is a file-like object

    uploaded_files = payload
    for i, uploaded_file in enumerate(uploaded_files):
    name = uploaded_file.get("name")
        file_data = uploaded_file.get("data")
        with open(f"{name}-{i}.jpeg", "wb") as file_handle:
            file_handle.write(file_data)

Low code usage

This component can be declared directly in Python, using backend-driven UI.

python
ui.FileInput(content={
        "label": "", # str 
        "allowMultipleFiles": "no", # str [yes, no]
        "cssClasses": "", # str 
    },
    handlers={
        "ss-file-change": handle_event,
    }
)
A function, in this example handle_event, should be implemented in your code to handle events.
python
def handle_event(state, payload, context, ui):
  pass

Reference