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

Close the modal when the required field is empty

I am having a problem with the modal and the required fields on my application. In one page, I have like 50 to 60 input fields, Some of them are required and some are not. I cannot just like check the value of every input using their ID whether if…
Milo
  • 99
  • 7
1
vote
0 answers

How to add event listener to Modal close on BootStrap 5.2

Trying to capture the close event on modal, but couldn't get a response from modalObj.addEventListener('hide.bs.model', function(event) { console.log("hide.bs.modal event") }); I was using BootStrap 5.2 and tested on both Firefox and Chrome on…
Papi314
  • 43
  • 8
1
vote
1 answer

Triggering a Bootstrap Modal in React without npm react-bootstrap

I try to code a Modal in React.js using Bootstrap5 but I can not use npm react-bootstrap out of several reasons. I tryd an approach where I use state to set Modal classes with a button which worked with my NavBar as well, but it does not work for my…
1
vote
2 answers

How can I connect between my form and modal?

I made a form project with react. My form is working well for now but I want add bootstrap modal to my form. When I click the enter button, I want to show a modal. I found modal example on the web but I can't establish connection between form and…
1
vote
0 answers

How to pass data Table to Modal in php?

Hello i use bootsrtap and custom css to fronted also i create one code from table to edit user info in table row last is setting icon there user click and get their edit option but unfortunatly there only one id is set help below my code
ptech
  • 11
  • 3
1
vote
1 answer

Bootstrap Modal not popping up due to some JQuery File missing?

I have tried almost every Solution related to this but I am still unable to figure out why Bootstrap Modals are not working with me. Whenever I click on the "button", the modal doesn't load. This is my base.html file where I have included the…
Asad Hussain
  • 564
  • 2
  • 15
1
vote
1 answer

Using 'Alert' Interface in Selenium Java for alert conformation not working as expected

I used below selenium codes to click "OK" alert box, But It is not identifying, I dont knw wht's the reason, Can anyone help to solve this Issue ? Element image: Code trials: Alert click_on_update_button_Htwelveyes = driver.switchTo().alert(); …
1
vote
1 answer

Custom validation in CoreUI form is not working

I am trying to add custom validation to my form on modal using coreui react but not able to get it to work. Getting below error Property 'noValidate' does not exist on type 'IntrinsicAttributes & CFormProps & RefAttributes'
veena panakanapalli
  • 361
  • 1
  • 3
  • 19
1
vote
0 answers

Pressing tab doesn't cycle through my form inputs

I'm using ReactJs 18 and MDBootstrap for styling. I have a form component that I use inside a modal (I have many forms but trying to use the same modal). Pressing tab or shift-tab to go forwards or backwards through the inputs of my form should…
saafgh
  • 33
  • 8
1
vote
1 answer

Bootstrap Modals staying open/alive on reload

I have several buttons within my code that calls showModal(title). showModal(title) { this.modalTitle = title this.$bvModal.show("add-modal") } The targeted modal is shown below.
1
vote
0 answers

how to prevent bootsrap modal from scrolling up when closed?

is it possible to stop the page from scrolling up when a modal is closed? I already tried doing this: Close Close
magicianiam
  • 1,474
  • 7
  • 33
  • 70
1
vote
2 answers

Changing React Bootstrap Modal.Header closeButton icon

I am working with React Bootstrap Modal. I'm trying to change the closeButton icon. But it didn't work. Cart
Pdev
  • 11
  • 3
1
vote
1 answer

Bootstrap Modal should return focus to last focused element after closing

I have focusable table rows, which on trigger open a Bootstrap Modal. However I noticed that whenever I close said Modal, the focus seems to disappear entirely and starts back in the beginning. Is there an easy way to prevent this? If not, I was…
alex
  • 576
  • 4
  • 25
1
vote
0 answers

Dash unselect datatable cell when closing dbc.modal

I am actually working on a dash project. In this one, I have a datatable which is updated each 5 seconds. When I click on a cell of the datatable (= when active_cell is not None), the is_open parameter of my modal is set to true and values depending…
Ces
  • 76
  • 1
  • 7
1
vote
1 answer

How to set a dynamic id for Boostrap Modal data-bs-target?

I need to set as a dynamic id for the Boostrap modal and refer it.