Questions tagged [react-modal]

Accessible modal dialog component for React.JS

260 questions
2
votes
1 answer

Insert ID in React Modal

I am using https://react.semantic-ui.com/modules/modal/ this modal. I would like to add an id attribute in div which have modal class. How can I do that ?
abu abu
  • 6,599
  • 19
  • 74
  • 131
2
votes
2 answers

React native - open multiple modals one after the other inside for loop

I first make an Ajax call (to an API) which provides me some data, a list of achievements (array of objects). I would like to loop through this array, show the first achievement as a Modal and on click of a button close the modal then show the next…
John
  • 3,529
  • 14
  • 42
  • 48
2
votes
4 answers

Dynamic content with React js Modal

I want to get dynamic content with React js modal I am using package react-responsive-modal. First I render all the post through map. Now I want when I click the individual post the modal should pop up and show me only that particular post's title…
Basit
  • 327
  • 3
  • 8
  • 19
2
votes
0 answers

Handle react modal with callback

I'm trying to implement something that should allow me to manipulate some modals (using react-modal) more easily. I see a lot of library out there that handle modals in a very simple way, with callback, promises etc... like vex or sweet alert So far…
Tnargib
  • 73
  • 12
2
votes
1 answer

React-Modal Unable to set position

I'm using react-modal, and I cannot find any way to successfully set the position of the Modal. I'm using inline styles per examples online, but they have no effect. I'm doing exactly what I see working in the codepen example on the react-modal…
MidnightJava
  • 1,927
  • 2
  • 18
  • 38
2
votes
0 answers

React Modal Resets Scrollbar on Opening Modal

Right now whenever my modal closes, it scrolls all the way left and does not return to the original div that called it. Ive tried every api callback and every react lifecycle method, and nothing works. However, if i use scrollIntoView in the…
2
votes
2 answers

Open modal from another component click in react js

I am using the basic component modal component of react - https://github.com/reactjs/react-modal What I am trying to achieve is that I want to open the modal from another parent that has the modal imported. Parent.js
pj013
  • 1,393
  • 1
  • 10
  • 28
2
votes
3 answers

react-modal shouldCloseOnOverlayClick not working

I'm using react modal, and the modal will not close upon clicking the overlay. I provide props to both isOpen and onRequestClose, but the modal remains open. closeModal= () => { this.setState({ modalIsOpen: false }); };
l-spark
  • 871
  • 2
  • 10
  • 25
2
votes
1 answer

TypeScript - Problems importing some npm packages that use declaration files (typings) from DefinitelyTyped

For some of the modules I'm importing I end up modifying their declaration files to get them working. I'm not sure if I'm going about it wrong or if there just happen to be issues with the typings for these modules. index.tsx import * as React from…
2
votes
1 answer

React-modal for dynamic display of images

I'm building an app using react , I have a page where all images display dynamically. I want those images to open in react-modal when I click . How do i set the modal for the images to be displayed What property should I set in a modal so that it…
Mitali
  • 33
  • 1
  • 8
2
votes
0 answers

React Modal always unmounts and mounts children so ref callbacks have weird behavior. Why doesn't it just rerender the children?

I have a react modal, which renders it's children: // base_modal.js import React, { Component } from 'react'; import Modal from 'react-modal'; export default class BaseModal extends Component { componentDidMount() { console.log("BaseModal…
evianpring
  • 3,316
  • 1
  • 25
  • 54
2
votes
1 answer

Error on calling react-modal in rails 4 app

I'm having trouble using react-modal in my rails 4 app with a react-rails front end. I have already followed the steps in this SO question How to call react-modal from rails-assets.org in react-rails component and in this GitHub issue…
h_tm
  • 137
  • 1
  • 9
1
vote
0 answers

React maximum call stack exceed

When I click on add and a modal appears then I can fill that and everything is okay. But when I open a modal by clicking on a newly created data and then when I click the save button then maximum call stack exceed appears. I saw that when I'm…
1
vote
2 answers

Cant Reset ReCAPTCHA When React Modal Gets Closed by the User and Opened Again in Next.js

I have a react-modal form with a captcha in it. When the user open up the modal the captcha shows up just above the Report Job button. No problems there. but let say the user closes the modal before even submitting or escaped the modal. so in that…
sam
  • 9
  • 3
1
vote
2 answers

How to wait the data from modal to continue the function?

I am using modal to answer if the user want to delete some data. I need his answer to continue the function and delete or not depending on what was chosen. Here is my code: I am using an imagem to call the function: