Stack Overflow
Stack Overflow

Questions tagged [bootstrap-modal]

Bootstrap provides a JavaScript-powered dialog element that can be used to replace native dialogs (to a degree); unlike native dialogs, Bootstrap modals cannot block the flow of execution.

Bootstrap provides a JavaScript-powered dialog element that can be used to replace native dialogs (to a degree); unlike native dialogs, Bootstrap modals cannot block the flow of execution.

Dialogs can be manually triggered (using Bootstrap's .modal() function), or via data-attributes. Modals must be triggered on correctly-structured HTML templates, as shown in the linked documentation.

7716 questions
1
vote
1 answer

How to properly set state to allow React Bootstrap Modal to work on mapped data?

Trying to build a D.R.Y. list of vocabulary terms with React Bootstrap (v.2.2.3) using Bootstrap 5.1. I bring in my data: import vocData from '../data/vocData' My component: const VocList = () => { const [show, setShow] = useState(false) const…
DᴀʀᴛʜVᴀᴅᴇʀ
  • 7,681
  • 17
  • 73
  • 127
1
vote
0 answers

Bootstrap modal always execute after Datatables's page change event

I'm trying to create a custom modal with bootstrap and It's purpose is to warn user If there are unsaved works before changing page. But for some reason, The modal is always appear after the DataTables change the page. Here is my code: let…
TamTam
  • 547
  • 1
  • 5
  • 16
1
vote
3 answers

how to show bootstrap Modal in another component react js

I am using react bootstrap Modal now I have Modal I want to show that modal in different components for the provided edit functionality. how I can archive this UpdateUserModal.js import React,{useState} from 'react' import {Modal} from…
vinod sharma
  • 103
  • 5
  • 13
1
vote
0 answers

Bootstrap modal works fine locally, but gives TypeError when deployed live

I am using the Start Bootstrap Freelancer theme and have added the exact same styles and scripts to my project as are included in this repo. When testing locally, the modals work perfectly fine and the app encounters no errors. After deploying,…
Kou-kun42
  • 11
  • 1
1
vote
0 answers

Modal is not showing with a href

This is my modal
1
vote
1 answer

Moving Bootstrap 3 Modal left in Yii2

I have a Bootstrap 3 Modal that conditionally needs to move to the left so that data on the main page can still be seen when the dialog is open. If a
appears in the modal that has class="modal-left", the modal should appear to the left of the…
Papa Joe Dee
  • 303
  • 4
  • 13
1
vote
3 answers

Microsoft forms embed in bootstrap modal dialog not working

I'm trying to embed a Microsoft Forms survey in a modal dialog. When a user clicks a button, I want a dialog box which loads the Microsoft Forms survey. When using the below code, instead of the actual survey, Microsoft Forms just displays a link.…
pradeep
  • 175
  • 1
  • 13
1
vote
0 answers

Styles on elements inside modal-body aren't being applied

If I show the modal as written below and without tampering with it after releasing and running my web application, the divLocation style is applied to the "Germany" text, e.g. it gets a red background. If I press a button, remove
Francesco B.
  • 2,729
  • 4
  • 25
  • 37
1
vote
0 answers

How can I prevent bootstrap collapse from making overlapping divs when their size is variable during program usage

JSFiddle - https://jsfiddle.net/silkpuma/fb1gqxh5/#&togetherjs=Pt1jA1Ri2K When using bootstrap collapse my div sizes can change. This leads to my divs then overlapping. I tried using a container with row for each section of my program that I don't…
Dennis Marchuk
  • 11
  • 3
1
vote
1 answer

jQuery button onclick event not recognised on dynamic modal content form

I am generating dynamic content for my modal-body which includes a comment submit form. I put together a function that on click of the submit button is supposed to trigger an AJAX call to handle the comment submission, but for whatever reason…
Armitage2k
  • 1,164
  • 2
  • 27
  • 59
1
vote
2 answers

Is it possible to trigger a Livewire modal component with Bootstrap?

I'm trying to render a modal that gets triggered by a button, so that I can then include payment elements in this modal and allow the user to begin to make payment. However, most Livewire modals I've seen - here, for example - use Livewire events to…
Hashim Aziz
  • 4,074
  • 5
  • 38
  • 68
1
vote
0 answers

Why is my Modal not popping up after boolean change?

I am having this issue with a project using Vue 2.6.12. The goal is to open "add-metric" modal when the user closes "close-metric" modal with an option or multi-options selected. These 2 modals are separate components that are a child to the parent…
JoCodesAlot
  • 11
  • 3
1
vote
0 answers

How do I show a Bootstrap 5 modal as a form success message upon clicking submit? Using Netlify for logging submissions

Without using jquery or PHP, how do I trigger a modal upon a successful form submission? I'm using Bootstrap 5. My form submissions are being sent to Netlify.
James
  • 26
  • 4
1
vote
1 answer

static navbar shakes horizontaly on leaving modal

currently I have troubles with bootstrap5 and modal respectively glightbox. when switching back from these applications, the static navbar shakes horizontaly. the same with glightbox, additional to that the sticky footer also slides up when the…
user5922808
1
vote
1 answer

Call a modal (Bootstrap 5) from Jinja2 templating

I'm likely the nth person to have asked this question but am having trouble parsing the relevant documentation; I want to add a modal dialogue to a button declared with a function in Jinja2. The code for the form where I want the modal to be called…
hal
  • 33
  • 6
1 2 3
…
99 100