Controlled Component about react-native-checkbox HOT 23 OPEN

@nicholaslee119 If you do not do anything in onValueChange then the checkbox should not toggle on clicking it right. But it changes.

  <CheckBox value={value} /> 

Here the value would never change. But onClicking CheckBox it toggles.

from react-native-checkbox.

Sorry for the delay, we will figure this out in a few weeks 😢

from react-native-checkbox.

such a turn off from this library,

from react-native-checkbox.

That's my issue. Especially since this uses a library for the iOS part.

from react-native-checkbox.

@SConaway I think the Facebook engineers should help as well as the docs recommend this library

from react-native-checkbox.

The way I resolved this issue, was to use a TouchableHighlight that initially wraps the Checkbox with a disabled value of true. Then conditionally show the Checkbox if the value is true or the TouchableHighlight e.g.

          {someValue ? (
            <CheckBox
              value={someValue}
              onValueChange={onValueChange}
            />
          ) : (
            <TouchableHighlight
              onPress={onValueChange}
              underlayColor="grey"
            >
              <CheckBox
                disabled={true}
                tintColors={{ false: grey, true: 'grey' }}
              />
            </TouchableHighlight>
          )}

This is a massive hack, but it works as expected for me. Hope this issue can be resolved soon.

from react-native-checkbox.

I'm having the same issue, some news?

from react-native-checkbox.

I'd be willing to work on this, but it's all native code (not a strength of mine)

from react-native-checkbox.

I think these should have been resolved by now. It is such a basic and important functionality. I know its very easy for me to say to resolve the bug but due to my lack of native development knowledge I am not able to help you.

from react-native-checkbox.

@nicholaslee119 any help about this?

from react-native-checkbox.

@nicholaslee119 No need to be sorry, open source is difficult, thank you for replying

from react-native-checkbox.

https://github.com/react-native-community/react-native-checkbox/blob/be115e479782704382348544d6ec018daa2aa833/example/App.js#L125-L141

I have tried to reproduce this in our example code, but the value of checkbox has been changed after clicking the toggle button just like above

I did not use the function component with the react hook, but I think it is the same with setState in the class component.

Any detail which I did not notice to reproduce this bug?

from react-native-checkbox.

https://github.com/react-native-community/react-native-checkbox/blob/223e604f4fbe1abd57a476d743d294f6de82a38a/example/AppFunction.tsx#L25-L86

I also tried to reproduce this in the function component, but it also works well is iOS and Android

from react-native-checkbox.

Here was my component: <Checkbox value={getSelectedFact} onValueChange={(newValue) => setSelectedFact(newValue)} />. Then, in some other function, I would toggle getSelectedFact.

I am modifying the example to match and will upload relevant code.

from react-native-checkbox.

#42 (comment)

Based on this comment value prop is used to define the initial value of the checkbox. But the better version would be to have a controlled component checkbox with a value prop (eg: TextInput)

from react-native-checkbox.

Yeah. That's what needs to change in my opinion

from react-native-checkbox.

So oddly enough, I was unable to reproduce it with the latest version in a fresh-RN project. I was unable to successfully build the example, so that's why I created a quick test project. I am deploying my original idea into the actual project and will test it there.

Feel free to close this issue if you'd like

from react-native-checkbox.

@SConaway I am still facing the issue. I am using 0.5.3 version

from react-native-checkbox.

Same issue here. The only solution was to wrap the Checkbox as @agreco said, keep the Checkbook disabled and control if its checked or not with the TouchableHighlight.

from react-native-checkbox.

At least should have two versions if you like, one controlled and another uncontrolled.

from react-native-checkbox.

any progress?

from react-native-checkbox.

@nicholaslee119 If you do not do anything in onValueChange then the checkbox should not toggle on clicking it right. But it changes.

  <CheckBox value={value} /> 

Here the value would never change. But onClicking CheckBox it toggles.

I believe this is the key right here. Clicking it changes the value. Clicking it should not change the value, just call the onChange / onValueChange callbacks.
Any plans to fix this?

from react-native-checkbox.

Can anyone suggest any different module to display checkbox in react-native? This module's development seems to be dead.

from react-native-checkbox.