sveltejs / sveltejs/kit

Remote Function: Multiple selects in for loop lead to unused selects being set to nothing on first toggle

Open
#15,230 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

forms
Dominant language
JavaScript
Stars
20.8k
Forks
2.3k
Avg merge
1d 16h
Merged PRs (30d)
156

Description

Describe the bug

When using multiple select controls created using a for loop, the first select toggled results in all the others being set to nothing.

I feel like they need to be initialised with a value at point of creation...somehow

Reproduction

Using the following example

https://stackblitz.com/edit/sveltejs-kit-template-default-wexxfwxy?file=src%2Froutes%2F%2Bpage.svelte

Use any of the selects and the other 2 will get set to no value.

Only the first toggle of a select causes the issue. All further interactions leave the values of all selects set as expected.

Logs

System Info
System:
    OS: Windows 10 10.0.19045
    CPU: (4) x64 Intel(R) Core(TM) i5-4570 CPU @ 3.20GHz
    Memory: 3.36 GB / 15.91 GB
  Binaries:
    Node: 22.14.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.17 - C:\Users\SDE\AppData\Roaming\npm\yarn.CMD
    npm: 10.9.2 - C:\Program Files\nodejs\npm.CMD
    pnpm: 10.17.0 - C:\Users\SDE\AppData\Local\pnpm\pnpm.EXE
    Deno: 2.6.6 - C:\Users\SDE\.deno\bin\deno.EXE
  Browsers:
    Chrome: 144.0.7559.110
    Edge: Chromium (140.0.3485.54)
    Firefox: 147.0.2 - C:\Program Files\Mozilla Firefox\firefox.exe
    Internet Explorer: 11.0.19041.5794
  npmPackages:
    @sveltejs/adapter-auto: ^7.0.0 => 7.0.0
    @sveltejs/adapter-node: ^5.5.2 => 5.5.2
    @sveltejs/enhanced-img: ^0.9.3 => 0.9.3
    @sveltejs/kit: ^2.50.1 => 2.50.1
    @sveltejs/vite-plugin-svelte: ^6.2.4 => 6.2.4
    svelte: ^5.49.1 => 5.49.1
    vite: ^7.3.1 => 7.3.1
Severity

annoyance

Additional Information

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue using the linked StackBlitz example in src/routes/+page.svelte, toggling each select and observing the other controls. Trace how the multiple selects are created and initialized, then verify that toggling one select no longer clears the others while their values remain independent.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.