Questions tagged [react-modal]

Accessible modal dialog component for React.JS

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…
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…
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

react-modal invoke on link click

using react-modal, need to show the modal on click of the hyperlink either through anchor tag or react-router-dom Link example: click on register hyperlink and register form modal should open handleClick() =>{ }
Sumanth
  • 159
  • 2
  • 15
1 2 3
17
18