Accessible modal dialog component for React.JS
Questions tagged [react-modal]
260 questions
0
votes
1 answer
React with Redux Popup or Modal syntax and setup
I have a MonthContainer component that renders a MonthView component. The container passes data to the view and the view does the formatting and displays a table with link buttons corresponding to month and category.
What I want to do is when a…

mo_maat
- 2,110
- 12
- 44
- 72
0
votes
1 answer
Using ReactModal button with Href, not working. Unsure why
I am fairly new to react and have redone my personal site in react. The issue I am running into is my button that links (with href) to my JSfiddle for each portfolio demo is not working. I am not sure if I did not bind correctly or what exactly the…

SpaghettiBathtub
- 29
- 1
- 7
0
votes
1 answer
React-Modal Close button not working
I am using react-modal but my button to close the modal is not firing the onClick={this.handleCloseModal} making the button inside the modal completely unresponsive. I have been trying different things for hours and cannot figure out why this is not…

SpaghettiBathtub
- 29
- 1
- 7
0
votes
0 answers
React component not rendering on specific site
I built a react-app that is implemented on 3rd party sites as widget. The widget uses a REST API and renders different content in a react-modal depending on the app's state. For building the app I use webpack. Now the following problem appears:…

Gegenwind
- 1,388
- 1
- 17
- 27
0
votes
0 answers
React returns my mapped-over array data out of order
In my main component App.js, I have an array of data received from a redux store that looks like this:
[
{...}, {...}
]
Each object in the array contains information about a post (like a reddit post) that I map over to display as a preview card.…

Ty Hopp
- 55
- 8
0
votes
3 answers
Close React modal that was imported from other custom modal
First I define this component to reuse with modal windows
Template 1:
...
import Modal from 'react-native-modal';
class CustomModal extends Component {
constructor(props){
super(props);
}
componentWillReceiveProps(nextProps){
…

prospegto
- 359
- 2
- 5
0
votes
2 answers
React Bootstrap Table has button in each row to create modal, but one button will call modal's render multiple times
I have a React Bootstrap Table, each page of the table has 20 records. In each row, I added a button using following line
function attachFormatter(cell, row){
return (
);
}

Thomas
- 1,805
- 1
- 15
- 31
0
votes
1 answer
How to trigger react-modal from the layout container?
I'm working to use react-modal in my React+Redux+ReactRouter4 App.
I have a MainLayout container and a Home container.
The modal will only be used when the home container is rendered so I have ReactModal's logic inside the Home Container. And I can…

AnApprentice
- 108,152
- 195
- 629
- 1,012
0
votes
1 answer
react-select not showing assets properly on react-modal
I'm using react-select to have a select field on a modal I create with react-modal. The assets are not showing properly as shown in this image (the arrow is not being shown, and the displayable list is not being properly shown).
The modal, has a…

fedest
- 1,190
- 3
- 15
- 35
0
votes
0 answers
React + Mobx, creating "global" components and accessing them through deeply nested children
Disclaimer: This is my first reactjs application, so please feel free to just tell me which section I should be reading.
I'm using react-modal to create a simple modal. There are 2 very similar modals, so I created a AuthModal that wraps the content…

Tim
- 107
- 1
- 1
- 9
0
votes
0 answers
react-modal is rendered at bottom of the screen
I'm using react-modal in my app, but I can't easily get it to render on top of the current screen content. The modal always renders at the bottom of the screen (below the html body even).
This is my custom modal:
import Modal from…

kenneho
- 401
- 1
- 7
- 24
0
votes
1 answer
Cannot read property 'setState' of undefined when submitting form through react-modal
I feel like I am missing something probably pretty silly. I have a modal form pop up if a user wants to change their avatar photo. And the the function is running and updating my database, it just gets messed up when I'm changing the state ... so…

Taylor King
- 791
- 4
- 9
- 22
0
votes
1 answer
react-bootstrap modal, how to handle child component?
I'm using a Modal based on the example code from the docs: https://react-bootstrap.github.io/components.html#modals-live. What I want is for a child component to be rendered only when 1) it's data is ready, and 2) when the modal is opened. Also, the…

Sigfried
- 2,943
- 3
- 31
- 43
-1
votes
4 answers
ReactJS - Multiple modals
I am trying to create a simple modal form using react. I have achieved something like this:
Index.js
import React from "react";
import ReactDOM from "react-dom";
import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
import Modal from…

Geek
- 127
- 1
- 12
-1
votes
1 answer