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

ReferenceInput appears to ignore label, required and disabled properties when child is AutocompleteInput #3853

Closed
qpointsystems opened this issue Oct 22, 2019 · 3 comments
Assignees
Labels

Comments

@qpointsystems
Copy link

qpointsystems commented Oct 22, 2019

What you were expecting:
When using a ReferenceInput element with a child of AutocompleteInput, I expect to see the label property reflected in the form. Also, the disabled and required attributes should be considered.

What happened instead:
When the child of a ReferenceInput tag is an AutocompleteInput, the source is converted and displayed as the label and the label property is ignored.
It also appears that the disabled and the required attributes are also ignored when the child is a AutocompleteInput

Related code:
This works (BTW, the required and disabled are there to illustrate the issue and are actually dynamically added based on the boolean below member_focused, in case that looked weird.

<FormDataConsumer>
    {({ formData, ...rest }) =>                    
        <Fragment>                              
            <ReferenceInput 
                source="setID" 
                label="Set"
                reference="meta_set_info"
                sort={{ field: "name", order: "ASC"}} 
                filter={{ class_id: formData.class_id, status_enum: "enabled" }} 
                required
                disabled
                perPage={500} 
            >
                <SelectInput optionText="name"/>
            </ReferenceInput>                                   
            <BooleanInput 
                source="member_focused" 
                label="bh.labels.rules.member_focused"    
            />    
        </Fragment>                                       
    }    
</FormDataConsumer>      

this does not (only difference is the SelectInput became a AutocompleteInput

                      <FormDataConsumer>
                            {({ formData, ...rest }) =>                    
                                <Fragment>                              
                                    <ReferenceInput 
                                        source="setID" 
                                        label="Set"
                                        reference="meta_set_info"
                                        sort={{ field: "name", order: "ASC"}} 
                                        filter={{ class_id: formData.class_id, status_enum: "enabled" }} 
                                        required
                                        disabled
                                        perPage={500} 
                                    >
                                        <AutocompleteInput optionText="name"/>
                                    </ReferenceInput>                                   
                                    <BooleanInput 
                                        source="member_focused" 
                                        label="bh.labels.rules.member_focused"    
                                    />    
                                </Fragment>                                       
                            }    
                        </FormDataConsumer>       

Other information:
Played with this a lot trying different work arounds. My strong preference is to use the AutocompleteInput vs the SelectInput due to the number of choices the user faces

Environment

  • React-admin version: 3.0.0-beta.2
  • Last version that did not exhibit the issue (if applicable): Not positive ever worked
  • React version: 16.9.0
  • Browser: Chrome Version 77.0.3865.120 (Official Build) (64-bit)
  • Stack trace (in case of a JS error): n/a

Cheers!

@fzaninotto
Copy link
Member

Reproduced and confirmed, thanks for the report.

@fzaninotto
Copy link
Member

Fixed by #3855

@qpointsystems
Copy link
Author

Looks great! Also, I was able to get the required and disabled to work by using options={{}} syntax. AND, I was very happy to see beta 3 up on npmjs. Cheers!

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

No branches or pull requests

2 participants