Skip to content

rx.form on_submit silently drops all but the last value for a checkbox group (or any repeated-name field) #7342

Description

@stackedbyaradhya

Describe the bug

When a form contains a control that submits multiple values under the same name -- most
commonly rx.checkbox_group, but also any hand-built group of inputs sharing a name -- only the
last checked value reaches the on_submit handler's form_data. Every other checked value is
silently discarded, with no error.

The generated submit handler builds form_data with:

Object.fromEntries(new FormData($form).entries())

FormData.entries() yields one [key, value] pair per repeated name (so a checkbox group with
three checked boxes yields three pairs, all with the same key). Object.fromEntries keeps only the
last pair for any duplicate key, so the first two checked values are lost.

To Reproduce

import reflex as rx


class FormState(rx.State):
    result: dict = {}

    def handle_submit(self, form_data: dict):
        self.result = form_data


def index() -> rx.Component:
    return rx.form(
        rx.checkbox_group(
            rx.checkbox_group.item("Red", value="red"),
            rx.checkbox_group.item("Green", value="green"),
            rx.checkbox_group.item("Blue", value="blue"),
            name="colors",
        ),
        rx.button("Submit", type="submit"),
        on_submit=FormState.handle_submit,
    )

Check all three boxes and submit. FormState.result["colors"] is a single string (whichever
checkbox happens to be last in DOM order among the checked ones), not a list of all three checked
values.

Expected behavior

form_data["colors"] should contain all checked values, not just one.

Specifics

  • Python Version: not version-specific -- reproduced via a pure-Python/JS-semantics unit test
  • Reflex Version: main (current, post-0.9.12)
  • OS: not OS-specific
  • Browser (Optional): any -- this is a FormData/Object.fromEntries JS semantics issue, not
    browser-specific

Additional context

Verified directly in Node: Object.fromEntries(new FormData(...).entries()) really does collapse
a repeated key to its last value while leaving single-value keys (e.g. a plain text input) as
scalars, so this doesn't affect ordinary single-value fields -- only anything that legitimately
submits more than one value per name.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions