Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to disable fields? #66

Open
msageryd opened this issue Sep 26, 2016 · 1 comment
Open

How to disable fields? #66

msageryd opened this issue Sep 26, 2016 · 1 comment

Comments

@msageryd
Copy link

msageryd commented Sep 26, 2016

I need my input forms to be read-only until I put them in edit mode.

So I need to manage editable and disabled props of the fields.

InputField is easy:

<InputField
      placeholder='Namn'
      ref='contactName'
      editable={this.props.isEditable}
/>

SwitchField is not easy. I'd like to do like this:

 <WrappedSwitchField
  value={this.props.project.isActive}
  disabled={!this.props.isEditable}
  label='Active'
/>

or even

 <WrappedSwitchField
  value={this.props.project.isActive}
  editable={this.props.isEditable}
  label='Active'
/>

But the switch field doesn't propagate the disabled prop to the internal switch. I could make a custom field, of course. But it would be nice if all form-generator fields were disableable (is that a word?). It would also be great if the editable prop where used everywhere (instead of disabled for switches)

How about one new line in SwitchComponent.js?

//src/lib/SwitchComponent.js
render(){
  return(<Field {...this.props}>
    <View style={this.props.containerStyle}
      onLayout={this.handleLayoutChange.bind(this)}>

      <Text style={this.props.labelStyle}>{this.props.label}</Text>
        <Switch
        onValueChange={this.handleValueChange.bind(this)}
        style={this.props.switchStyle}
        value={this.state.value} 

-->     disabled={ (typeof this.props.editable === 'undefined') ? false : !this.props.editable }/>        

    </View>

  </Field>
  )
}
@MichaelCereda
Copy link
Owner

I'm going to check this.
The props passed to the parent component are propagated to the children so I guess it should work no matter what.
I'll include the change in the new version

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants