Edit Tables with Popup Form in PySimpleGUI (One Shot Window) – Helpful Tips

PySimpleGUI is a GUI framework that allows users to easily create graphical user interfaces for their Python applications. One common use case for PySimpleGUI is creating editable tables with popup forms for data entry. In this tutorial, we will walk through how to accomplish this using PySimpleGUI’s features.

First, make sure you have PySimpleGUI installed by running the following command:

pip install PySimpleGUI

Next, create a new Python script and import PySimpleGUI:

import PySimpleGUI as sg

Now, let’s define the layout of our GUI. We will start by creating a sample table with some data:

data = [
    ["John Doe", "john.doe@example.com", "555-555-5555"],
    ["Jane Smith", "jane.smith@example.com", "555-555-5555"]
]

layout = [
    [sg.Table(values=data, headings=["Name", "Email", "Phone"], auto_size_columns=False, num_rows=5, justification='left')],
    [sg.Button("Edit")]
]

In the layout above, we have created a simple table with data and a button labeled "Edit."

Next, let’s define the event loop for our GUI:

window = sg.Window("Table Editing with Popup Form", layout)

while True:
    event, values = window.read()

    if event == sg.WIN_CLOSED:
        break

    if event == "Edit":
        selected_row = values[0]

        # Create a popup form for editing the selected row
        edit_layout = [
            [sg.Text("Name:"), sg.Input(default_text=data[selected_row][0], key="Name")],
            [sg.Text("Email:"), sg.Input(default_text=data[selected_row][1], key="Email")],
            [sg.Text("Phone:"), sg.Input(default_text=data[selected_row][2], key="Phone")],
            [sg.Button("Save")]
        ]

        edit_window = sg.Window("Edit Row", edit_layout)

        while True:
            event, values = edit_window.read()

            if event == sg.WIN_CLOSED:
                break

            if event == "Save":
                data[selected_row] = [values["Name"], values["Email"], values["Phone"]]
                window["-table-"].update(data)

        edit_window.close()

window.close()

In the event loop above, we check for the "Edit" button click event. When the button is clicked, we extract the selected row index from the table and create a popup form for editing that row’s data. We then update the data with the edited values and refresh the table with the updated data.

Run the script, and you should see a window with a table displaying the sample data. Clicking the "Edit" button will open a popup form for editing the selected row’s data.

In this tutorial, we have shown how to create a simple editable table with popup forms for data entry using PySimpleGUI. This is just one example of the many features that PySimpleGUI offers for creating interactive GUI applications. Experiment with different layouts and widgets to customize your application further.