moroshko/react-autosuggest

react-autosuggest problems as 'in-place' editor in a react-bootstrap-table

Open

#315 opened on Jan 19, 2017

View on GitHub
 (2 comments) (0 reactions) (0 assignees)JavaScript (637 forks)batch import
help wanted

Repository metrics

Stars
 (5,936 stars)
PR merge metrics
 (No merged PRs in 30d)

Description

I'm trying to use react-autosuggest as an 'in-place' editor to edit cell values in a 'react-bootstrap-table' but having trouble to get it to work as expected. Clicking in the cell, the autosuggest input appears in the cell showing the placeholder text. When starting to type, the suggest list seems to appear with the 'filtered-down' content, but is clipped at the cell border, apparently. I created a pen to illustrate the behaviour:

http://codepen.io/neophob/pen/bggVBQ

Is there a possibility to get this working and the 'drop-down' to appear above the table-contents?

Thanks & greetings, Bernd Rode

Contributor guide

Research direction
Investigate CSS overflow and z index properties on the table cell and the autosuggest dropdown. Look into using a portal or adjusting positioning to allow the dropdown to appear above the table.
Tech stack
javascriptreactcss
Domain
frontend
Issue type
Bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
Active
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
Clear
Prerequisites
ReactCSS
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
75