question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

radio buttons initial option isn't updating on first load

See original GitHub issue

Description

I allow users to create another radio button option with a modal. When they submit that modal I want to add their new option to the radio buttons and set that new option as the initial option.

The new radio button does not pop up as selected even though I’m passing it as the initial option until I refresh the home page a 2nd time.

What type of issue is this? (place an x in one of the [ ])

  • bug
  • enhancement (feature request)
  • question
  • documentation related
  • example code related
  • testing related
  • discussion

Requirements (place an x in each of the [ ])

  • I’ve read and understood the Contributing guidelines and have done my best effort to follow them.
  • I’ve read and agree to the Code of Conduct.
  • I’ve searched for any related issues and avoided creating a duplicate issue.

Bug Report

Filling out the following details about bugs will help us solve your issue sooner.

Reproducible in:

package version: 3.2.0

node version:

OS version(s):

Steps to reproduce:

  1. Open a modal for a user to add a new option.
  2. Save that option when they submit the modal
  3. Refresh the home page with the new option pre-selected

Expected result:

What you expected to happen

Actual result:

What actually happened

Attachments:

Pre-selected radio button image

Modal where user creates new option choices image

New radio button option pops up, but it’s not selected as the initial option image

Proof that I’m passing the correct initial option when I refresh the home page screen image

When I click away and back to the home page (manual refresh) it selects the correct initial option image

Issue Analytics

  • State:open
  • Created 2 years ago
  • Comments:28 (13 by maintainers)

github_iconTop GitHub Comments

2reactions
MattB543commented, May 19, 2022

@srajiang someone on the Slack API workspace seems to have solved it! https://community.slack.com/archives/C02C28Z3XA7/p1652815757214569

“This is the default/expected behavior - the client will keep the user’s input if they have made a selection on an element, even if you update the options/initial_option. As long as the block_id is not changed”

In your examples were you setting a block id or was it random every time? I was setting my block id and never changing it.

1reaction
MattB543commented, May 17, 2022

@srajiang @ben-nz I’m still running into this (what I assume is caching issue) in more situations and it’s quite annoying.

the block is defined as having initial value: ‘🙂, 😐, 🙁’ image

But it shows ‘Custom Multiple Choice’ image

This issue is appearing after another view is pushed on top of this one and then submitted so the modal is going back to this view and the intial_option is passed correctly but not showing correctly.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Radio button not updating correctly based on change in Select ...
I know I have to update the "checked" property of the radio button whenever Select option is changed. But I am not able...
Read more >
Solved: Radio button OnSelect sometimes not working
Solved: This is a survey app. Users select radio buttons ranging from Strongly Disagree to Strongly Agree. There are multiple pages of questions....
Read more >
Why does the radio button has checked = false , but is ...
In HTML, the "checked" attribute is used to set the default/initial value of a checkbox or radio button. It doesn't tell you whether...
Read more >
Create and customize radio buttons in React Native
Radio button elements are crucial when it comes to letting the client choose between multiple options. For example, assume that you own a ......
Read more >
Radio button | Bulma
The radio class is a simple wrapper around the <input type="radio"> HTML elements. · You can check a radio button by default by...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found