FAQ Database Discussion Community


trigger bootstrap modal via jquery

javascript,jquery,twitter-bootstrap,bootstrap-modal
got a problem. I am trying to trigger bootstrap modal via jquery and it doesnt work. I tried every way: way no1: $(document).ready(function(){ $('#btn').click(function(){ $('#server_msg_modal').modal('show'); }); }); way no2: $(document).ready(function(){ $('#btn').click(function(){ $('#server_msg_modal').modal('show'); }); }); way no3: $('#server_msg_modal').modal({ show: 'true' }); nothing is working... please help me....

Angular Bootstrap Modal leaves backdrop open

angularjs,angular-ui,angular-ui-bootstrap,bootstrap-modal
I'm using AngularUI to integrate Bootstrap components in my Angular 1.4 app, such as Modals. I'm calling a Modal in my controller like so: var modalInstance = $modal.open({ animation: true, templateUrl: '/static/templates/support-report-modal.html', controller: 'ModalInstanceCtrl' }); Unfortunately, when I want to close the Modal by using: modalInstance.close(); The modal itself dissapears,...

Trying to create a specific data-target for bootstrap modal through ruby iteration

ruby-on-rails,each,bootstrap-modal
I am using bootstrap modal on my rails project. On this page I have to iterate through my slides and for each slide I want to create a modal. I came up with this solution: <% @slides.each do |slide| %> <div class="row slidecard text-center"> <div class="col-xs-12 "> <h2><%= slide.name.upcase %></h2>...

How do I steal the click event from an element?

javascript,jquery,html,twitter-bootstrap,bootstrap-modal
Long-story-short: I'm trying to make Bootstrap's modal window visible when the page loads. I copied a bit of HTML from W3Schools. <!-- Trigger the modal with a button --> <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button> <!-- Modal --> <div id="myModal" class="modal fade" role="dialog"> <div class="modal-dialog"> <!-- Modal content-->...

Bootstrap modals aren't populating properly

javascript,html,css,twitter-bootstrap,bootstrap-modal
so i have a few modals that are supposed to have their own content based off the content box they reference. When a user clicks the enlarge button(button that looks like a grey 'X') the modal should pop up with that information in it, but instead every modal just has...

Rails Bootstrap Modal Remote True does not work in form_for

ruby-on-rails,twitter-bootstrap-3,bootstrap-modal
Executive Summary I have Bootstrap Modal on a Rails 4 Server I have created This Modal is used to submit a NEW post via remote: true I get an error during the Form Submission saying remote true doesn't work. The form can actually submit successful WITHOUT the remote true but...

ASP.Net Razor MVC Bootstrap Login Modal Validation

asp.net,asp.net-mvc,twitter-bootstrap,razor,bootstrap-modal
Using Bootstrap in my Razor page, I am opening a modal window: <div class="container-fluid"> <div class="navbar navbar-fixed-top navbar-default"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="offcanvas" data-target=".navbar-offcanvas" data-canvas="body"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand pull-right" href="#"> <img...

Why I'm getting more than one on click event fire inside bootstrap modal

javascript,jquery,html,twitter-bootstrap,bootstrap-modal
I'm getting some problem here and need some help. I think this is easy but I just can't figure it out myself what's happening. Please see fiddle below: Fiddle When I only open the modal and clicks it for the first time. It works normally, but when I reopened it,...

Modal in modal - close button closes both modals

twitter-bootstrap,bootstrap-modal
I used this code, to create a modal in a modal http://jsfiddle.net/4w34e4q6/ Open first modal <div class="modal fade" id="one"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="modal-title">Modal title</h4> </div> <div class="modal-body"> <p>One fine body&hellip;</p>...

Ajax - Modal - Passing Variable

php,jquery,ajax,bootstrap-modal
I know this has been asked a lot but after looking up for this for like 6 hours I can say I've tried everything that with my current knowledge (which isn't much) I can understand so I decided to come here and ask for help from the pros :). This...

Bootstrap 3 Modal shown as full white screen

jquery,css,twitter-bootstrap,bootstrap-modal
I have a nav menu which opens different remote pages on modal. It was working without a problem but I guess, recently, I changed something on the page without noticing and now all I can see is a full page white screen whichever link I click on the nav menu....

Make a div of equal 5 divs in Bootstrap 3

css3,twitter-bootstrap,twitter-bootstrap-3,bootstrap-modal
I am trying to make a row of having 5 divs in a column width of 4 in bootstrep. So the code be - <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet" /> <div class="container"> <div class="row"> <div class="col-lg-4 col-lg-offset-4"> <!-- Main Content --> <!-- Weather --> <div class="element"> <div class="header_text"> Weather </div> <div class="element_body...

BootStrap Modal Code not working

twitter-bootstrap,gridview,modal-dialog,bootstrap-modal
My problem is that the modal doesn't appear when the button is clicked. The main div is directly copied from http://getbootstrap.com/javascript/#modals I have checked that my linking to the scripts in the head is correct. <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <link rel="stylesheet" href="css/bootstrap.css" /> <link rel="stylesheet" href="css/animate.css" /> <script src="css-sheets/bootstrap.js"></script>...

Show modal on form validation success

html,bootstrap,jinja2,bootstrap-modal,flask-wtforms
I'm trying to launch a modal if my flask-wtf form validation fails. The code snippet below otherwise works as expected other than it launches the modal even when I load the form before submission (appears that form.errors initialises to False before form is submitted). What do I need to change...

Should data-target=“#my-modal” put inside a modal div in Twitter Bootstrap?

twitter-bootstrap,modal-dialog,bootstrap-modal,dismiss
I know that putting data-target="#my-modal" in the launch button outside the modal div is necessary. But should I also put that code in the dismiss button inside modal div? Or the machine always knows it's to dismiss the modal div where it's exactly in? <button class="btn btn-success" data-toggle="modal" data-target="#my-modal">Launch Modal</button>...

Close Boostrap Modal on Contact Form 7 submit

jquery,bootstrap-modal,contact-form-7
In a Bootstrap Modal, I have a Contact Form 7. I can not make the Modal is closed after sending the mail. What you do is go to the link of the "action" attribute of the form. I can not delete the "action" attribute that is created dynamically. Perhaps a...

Bootstrap $modal window backdrop clears elements in the screen

angularjs,bootstrap-modal
I have a problem that is happening in my app and I don´t really know how to replicate here as a simplified version, so I ask this in case someone has an idea on what might be happening. I have an SPA which loads different views during the navigation. In...

Include HTML code in BootStrap Modal Dialog

javascript,jquery,html,twitter-bootstrap,bootstrap-modal
I want to make use of Boot Strap Modal(http://nakupanda.github.io/bootstrap3-dialog/), I have included Bootstrap Modal Scripts and Css in my HTML and the Bootstrap Dialog works fine. Now my question is how can I include my html code in the modal dialog. In the examples(http://nakupanda.github.io/bootstrap3-dialog/) it shows to include the HTML...

Bootstrap Modal Contact Form Disappear

php,html,css,twitter-bootstrap,bootstrap-modal
I have a problem with the Bootstrap Contact Form which disappear when the navigation bar is changed in terms of responsive design. I can't find the word for it right now, but basically the navigation bar is replaced by a navigation icon for mobile and tablet when the screen width...

Check if Bootstrap Modal currently Show

javascript,jquery,twitter-bootstrap,twitter-bootstrap-3,bootstrap-modal
I'm trying to combine the Keypress plugin with Modal dialogs in Bootstrap. Based on this question, I can check if modal is open or closed using jquery. However, I need to execute Keypress only if modal is closed. If it's open, I don't want to listen for keypresses. Here's my...

Bootstrap Modal won't reset after opening once

jquery,twitter-bootstrap,bootstrap-modal
The bootstrap modal window which appears on clicking "Add Column" won't reset once closed. As a result, I'm not able to add more than one value to the "Master table". The below code doesn't seem to work: $('body').on('hidden.bs.modal', '.modal', function () { $(this).removeData('bs.modal'); }); Not sure what is going wrong....

Bootstrap modal using custom CSS (from HTML template) not working well

twitter-bootstrap-3,bootstrap-modal
I have a bootstrap modal that on a Button click I show it. Everything works great but the Modal is displayed in the very right of the screen that I can't see even the Modal footer buttons. I'm using a HTML Template that has a custom Bootstrap CSS and that's...

Uncaught Error: Unknown provider: $templateRequestProvider <- $templateRequest <- $modal

angularjs,bootstrap,bootstrap-modal
Hello Stackoverflowers ;) I struggle for a bit of time on this particular problem concerning the bootstrap.ui modal: Uncaught Error: Unknown provider: $templateRequestProvider <- $templateRequest <- $modal I tried already to define a provider but I can't get it to work properly. This is my app.js: var app = angular.module('stelping',...

bootstrap-modal - How do I stop the background from showing at top when I scroll down

javascript,jquery,html,css,bootstrap-modal
First, I'd like to absolutely commend Jordan Schroter for making a practically indispensable and beautifully crafted addition to Bootstrap that should become part of their standard distribution! Now my question. I have a bunch of long modals that leave no space at the top when they are first rendered. BUT...

Conditional include js/css files for IE with meteor

javascript,jquery,meteor,twitter-bootstrap-3,bootstrap-modal
In pure html it is common to use conditional includes like: <!--[if lt IE 9]> <script src="js/html5shiv.js"></script> <script src="js/respond.min.js"></script> <script src="js/ltie9.js"></script> <![endif]--> My ltie9.js is pretty simple $(document).ready(function(){ $("#ltie9").modal('show'); }); The ltie9.js is wrapped by meteor into: <script type="text/javascript" src="/client/js/ltie9.js?dbe4ceed5fdf7ec4fd714612d501c94e5c19c04b"></script> Wrapped as it looks now:...

Bootstrap datepicker not woking in modal

twitter-bootstrap-3,bootstrap-modal,bootstrap-datepicker
When I use a datepicker inside a modal the datepicker is not working. I use the event show.bs.modal to modify some content of the modal on show: $(function(){ $('#statusModal').on('show.bs.modal', function (event) { var button = $(event.relatedTarget); var title = button.data('title'); var input_date = button.data('date'); var modal = $(this); modal.find('.modal-title').text('Clicked: '...

Bootstrap Modal Window pop-up after 5sec

javascript,twitter-bootstrap,settimeout,bootstrap-modal
Do anyone know how to make bootstrap modal window pop-up after 5sec ? I had done a Modal Window with auto pop up but I wish it's pop up delay 5 sec . can anyone help ? thanks for help . here my code . <div class="modal fade in" id="formSaludo"...

Datepicker in Angular ui modal not opening

angularjs,angular-ui-bootstrap,bootstrap-modal,bootstrap-datepicker
I have a datepicker within a form in my modal. The datepicker is not opening no matter what I try. My code is : //In my parent controller - Called on button click $scope.openModal = function(indx){ var modalInstance = $modal.open({ animation:true, templateUrl:'myModal.html', controller: 'MyModalController' }); }; //In MyModalController $scope.open =...

Modal Button Click Event

c#,asp.net,twitter-bootstrap,bootstrap-modal
I have a modal that pops up when you click a button, inside that modal I have a save button. When that save button is pressed I would like to fire some C# code in a with an OnClick function.... Can anyone tell me why this isn't working for me?...

Show Bootstrap login modal over Google Maps API

javascript,jquery,twitter-bootstrap,google-maps,bootstrap-modal
I'm trying to create a webpage that will load Google Maps API as a background, and then check if the user is logged in. If they are logged in, the page will load data from the database and update the map (haven't programmed that much, just a placeholder alert). If...

Dynamic Modal Bootstrap

javascript,jquery,html,twitter-bootstrap,bootstrap-modal
I have a table like: When user selects Edit, it opens up a bootstrap Modal containing all td of the tr the Modal is launched from. What I've done so far is: Get Row Index on Edit Click: $(document).on('click', '#editNominHref', function(e) { var global_edit_row = $(this).closest('tr').index(); $('#editNomiModal').modal('show'); }); What I...

Close angular bootstrap modal window from a controller

angularjs,angularjs-directive,angular-ui,bootstrap-modal,meanjs
I have a contact form inside my modal window. After successful post request i want to close the modal automatically. I am using MEAN.JS here is my controller angular.module('core').controller('FormCtrl',['$scope','$http', function($scope,$http) { $scope.postMail = function (data) { $http.post('/mail', data). success(function(data, status, headers, config) { alert('success'); //close function....?? }). error(function(data, status, headers,...

JQuery on click event on Href [duplicate]

javascript,jquery,bootstrap,bootstrap-modal
This question already has an answer here: Event binding on dynamically created elements? 8 answers I am appending data dynamically to my table as: function myFunctionEdit() { var table = document.getElementById("nomiTable"); var len = table.rows.length; var row = table.insertRow(len); var cell1 = row.insertCell(0); var cell2 = row.insertCell(1); var cell3...

Bootstrap tabs are not working via AJAX in a modal

jquery,ajax,twitter-bootstrap,bootstrap-modal,bootstrap-tabs
It working fine without modal and ajax. But when I load tabbed panel in modal using ajax it does not select Tab Panes. <!-- Nav tabs --> <ul class="nav nav-tabs tabs-left"> <li class="active tab-selection"><a data-toggle="tab" href="#financial">Financial</a></li> <li class="tab-selection"><a data-toggle="tab" href="#marketing">Marketing</a></li> </ul> <!-- Tab panes --> <div class="tab-content"> <div class="tab-pane active"...

AngularJS/Bootstrap - Select row and open details in modal with button

angularjs,angular-ui-bootstrap,bootstrap-modal
I'm using AngularJS, Bootstrap, and data-toggle to open a modal. I want to click on a row in a table, get the index number and store it, and click a button to open a modal that displays more details for that row using the stored index. My code right now...

Twitter Bootstrap 3: Click link in modal window, close it and smooth scroll to hash

jquery,jquery-plugins,twitter-bootstrap-3,bootstrap-modal,smooth-scrolling
I'm using the jQuery One Page Navigation plugin Git link and Twitter Bootstrap 3.3. Everything works fine except one thing: additional links in modal window doesn't work with smooth scroll effect. I've found this solution for inline links: function scrollNav() { $('#program_scroll a, #closemodal a').click(function(evn){ evn.preventDefault(); $('html,body').scrollTo(this.hash, this.hash); }); }...

Bootstrap 3 Example Code for Modal Window Not working

javascript,jquery,twitter-bootstrap,twitter-bootstrap-3,bootstrap-modal
This question is so simple as to be embarrassing. As a test of something I copied the code from http://getbootstrap.com/javascript/#modals directly into a page that only carries a basic page setup, and yet it doesn't work. Which means I'm doing something extremely stupid. Here's my entire page: <!DOCTYPE html> <html>...

attach event handler to bootsrap ok button, where to find html?

jquery,angularjs,bootstrap-modal
Can someone tell me how to attach an event handler to a bootsrap OK button. Say for example I want to show an alert("hello world"); when the user click on ok in the notification dialog. I know how to do that with jQuery but I couldn't find the button's html...

Issue with opening modal in plunker

angularjs,bootstrap-modal,plunker
I'm trying to recreate an issue with angular modal but I can't get plunker to work for basic modal. This gives error of index 0, but can't figure out where I should be passing these items from. In the code that I'm using, I don't get this issue. But when...

Populating Bootstrap modal w/ sql from table row click

php,mysql,ajax,twitter-bootstrap,bootstrap-modal
I've been working on this all week and finally gave up and decided to ask outright. What I have is a list of open jobs in a bootstrap table that is populated via a mysql query. When a row is clicked, a model appears showing the details of the job....

Bootstrap - Modal keeps “display: block” when hidden

javascript,jquery,css,twitter-bootstrap,bootstrap-modal
I have a bootstrap modal in my web app that keeps being displayed even when I launch myModal.modal('close');. I am pretty stuck with that strange problem. Approx. one in ten times, I have that display: block; staying after close. The modal is correctly hidden because I can't see it anymore...

angular bootstrap modal backdrop not showing for bootstrap css version 3.3.2

angularjs,angular-ui-bootstrap,bootstrap-modal
change the css version to 3.3.2 in this plunker code and the backdrop won't appear when you open the modal. from <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> to <link href="//netdna.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"> http://plnkr.co/edit/rzU6gQsjEP4R9sGKO2dl...

modal edit form wont display

jquery,asp.net-mvc,twitter-bootstrap,bootstrap-modal
using bootstrap 3.1 with mvc4. I had the modal form displaying fine, but no data in the form. Once I fixed the data populating the edit form (at least I know it hit the controller an received data), the screen is grayed but the form is not displayed. I can...

Capture close event on Bootstrap Modal

events,bootstrap,bootstrap-modal
I have a Boostrap Modal to select events. If the user clicks on the X button or outside the modal, I would like to send them to the default event. How can I capture these events? This is my code: <div class="modal" id="myModal"> <div class="modal-dialog"> <div class="modal-content event-selector"> <div class="modal-header">...

Trigger bootstrap modal if a condition statement is not met

javascript,jquery,twitter-bootstrap-3,alert,bootstrap-modal
Instead of using the default jquery alert popup, I'd like to trigger a Bootstrap Modal. All the tutorials I've read, the modal is triggered by the click(function(){});. I'd like to have if triggered if a condition in my "if statement" is not met. Here is the code I have var...

How to reload page after bootstrap modal closed

javascript,jquery,twitter-bootstrap,bootstrap-modal
$("#customerAdded").modal("show").on("shown.bs.modal", function () { window.setTimeout(function () { $("#customerAdded").modal("hide"); }, 5000); location.reload(); }); Ok, it works. But with location.reload(), despite I change the time, the page is reloaded immediately. I would, after modal closed, that the page was reloaded according the time specified. ...

Scrollbar disappearing when use modal on Bootstrap

css,twitter-bootstrap,twitter-bootstrap-3,bootstrap-modal
So, I have tried put a modal on a link <li> in my menu, but when I click it, the scrollbar of the page disappears. Look, this is my menu: <nav class="navbar navbar-default bg-primary"> <ul class="nav navbar-nav navbar-right"> <li ><a href="#myModal" role="button" data-toggle="modal">History</a></li> <!-- Modal --> <div class="modal fade" role="dialog"...

Django: form validation errors are not being displayed when form is in a modal

django,twitter-bootstrap,bootstrap-modal
I am trying to make a Django web app that will be able to add and display certain information in a database (the Agent model seen below) I have a form in a twitter bootstrap modal. When I enter valid data and submit, everything works as expected and the modal...

Remote validation doesn't work when property to validate is inside a modal Bootstrap

asp.net-mvc,asp.net-mvc-3,data-annotations,bootstrap-modal,remote-validation
I'm using ASP.NET MVC3. When an user create an account, I need the chosen nickname be unique, so I use the Remote DataAnnotation like this : public class UserModel { [Required] [Remote("CheckNickname", "Validation", ErrorMessage = "This nickname is already used")] public string Nickname { get; set; } // ... }...

Angular ng-repeat filter passing wrong index

javascript,angularjs,angularjs-ng-repeat,bootstrap-modal
I'm having trouble figuring out how to pass the right index number from an ng-repeat with a filter. I'm using a modal-window to edit rows in a table. The problem is I rely on the index number to make a REST call and get the correct data for my edit...

What is the best practice to use Bootstrap's modals with dynamic content?

javascript,html,forms,bootstrap-modal
It's a minor question, but here's the thing, I have this dynamic list of news in my webpage, when you click a link it opens a modal with a title and a paragraph. At the moment I'm thinking that since the number of links will always be small -like 6...

Set focus to control after show modal

jquery,twitter-bootstrap,bootstrap-modal
I need to set focus on a control inside the modal after the show modal event. Here's the code I have so far: $('#searcherCustomerModal').on('shown', function () { $("#txtNameCustomer").select(); }); But it does not work. Any Ideas?...

angularJS resolve: in controller "Cannot read property 'goals' of undefined

javascript,angularjs,twitter-bootstrap,bootstrap-modal,ui.bootstrap
This is my first question on stackoverflow. ( I know I struggled a lot with the quotes..) I am stuck with this problem where a snippet of the following code leaves me with the following error: TypeError: Cannot read property 'goals' of undefined at $scope.addValue.$modal.open.resolve.goals (app.js:59) at Object.invoke (angular.js:3762) at...

Variable changes from function call not displaying in angular-bootstrap modal window

javascript,angularjs,angularjs-scope,bootstrap-modal,angular-bootstrap
I am trying to use angular and bootstrap to create a modal window that displays a youtube video. Following the modal example on the angular bootstrap page worked fine when I hard coded the youtube URL. However when I try to create a variable with the URL in it when...

Bootstrap Modal + Datepicker + Form Values

jquery,forms,twitter-bootstrap,datepicker,bootstrap-modal
I have a form inside a bootstrap modal that has an input using bootstrap datepicker. I use this modal as an "update" form to update a saved database record. The values get passed to the form correctly. However, if I click on the datepicker input, the date dropdown comes up,...

Create modal when table row was clicked

jquery,bootstrap-modal
How am I going to create to a modal where the user could edit the content from the selected row inside a table? Can someone please teach me on how to do this? I kinda new in web development and I just need to do this as a requirement. Thanks!...

Bootstrap modal seems disabled on ios device

javascript,html,ios,css,bootstrap-modal
i bought quick-admin template. I use bootstrap modal, it's okay with PC and android, windows phone but on iOS device all input tags in modal seems disabled and i can't edit inputs. But other templates it works fine. Please can anyone tell what is problem? maybe js or css prevent...

How do i open new modal after closing an open modal

jquery,html5,twitter-bootstrap,twitter-bootstrap-3,bootstrap-modal
I am using bootstrap 3.2.0. I have a scenario of a modal with 3 buttons. Each button will open a new unique modal. But i want it this way, if i click on any of the 3 buttons, the open modal (the one with the 3 buttons) should dismiss and...

Spring MVC delete using modal

java,javascript,spring,spring-mvc,bootstrap-modal
I have a problem on delete item using modal. I can delete the using just the href obtaining the id and passing it to the controller. But i dont know how to get the id of the item in modal and delete it. List of persons and actions to be...

Button Click Event from inside a modal not firing when using angular.js and ui.bootstrap

javascript,angularjs,angular-ui-bootstrap,bootstrap-modal
I am very new to ui.bootstrap and angular js. i have a very peculiar issue when using bootstrap modal with agular js. i am using boostrap ui's web site for my reference. below is the code snippet i am using. in the user directive, for add new user button click,...

Can´t validate reCaptcha v2 in modal

jquery,recaptcha,bootstrap-modal
Actually, I have a project who requires a form in a boostrap modal. This modals have a name, email, msg inputs and google recaptcha. I want that when the required inputs are filled and the captcha is not checked, show an error modal, and when the required inputs and the...

Bootstrap 3 modal opening with a restricted height despite not height being set?

twitter-bootstrap,twitter-bootstrap-3,bootstrap-modal
I have a "Check Availability" button which opens a Bootstrap 3 modal on this page: http://www.cairnsmorecottages.co.uk/tackroom-cottage-newton-stewart.php This opens correctly. I have EXACTLY the same button on the following page, the only difference is that it is titled "Tackroom Cottage", but this time it opens with a restricted height. What gives?...

Can't validate a form in Bootstrap Modal using JavaScript

javascript,jquery,forms,validation,bootstrap-modal
Using the code below I send an email, but if I leave the inputs blank it sends it anyway. I want to validate the form before sending it, to make sure that they are not blank. j( document ).on( "submit", ".form-horizontal", function() { j.post(this.action, j(this).serialize(), function(){ //this callback is executed...

Using bootstrap modal, its shown, but suddenly it hides

jquery,html,ajax,twitter-bootstrap,bootstrap-modal
Well, I have a Jquery Datatables with some buttons linked to a modal(only to confirm the action). When I click the button, the modal appears for a second or less, but then suddenly disappears. The action of the button its done even I dont confirm the action by the modal....

Reset modal data with bootstrap + jQuery

jquery,twitter-bootstrap,jquery-select2,bootstrap-modal,twitter-bootstrap-2
I have a MVC 5 c# project using Bootstrap bootstrap-transition.js v2.3.1, with bootstrap-modal.js v2.2.0, jQuery jQuery JavaScript Library v2.1.3 and finally, select2 Version: 3.5.2. In this project, the I have a modal with the following information: <div class="modal fade" id="@Model.modalId" tabindex="-1" role="dialog" aria-labelledby="@Model.modalId" aria-hidden="true"> <div class="modal-dialog" style="overflow-y: auto; max-height: 80vh;">...

angular bootstrap modal won't appear in the front when browser is full screen on an element

angular-ui-bootstrap,bootstrap-modal,angular-bootstrap
When I go full screen on an element and then try to display angular bootstrap's modal in front, it won't appear in front. To test it: 1 - Click on this link http://plnkr.co/edit/oKZHZZebyNMwpG114Jyy?p=preview 2 - Click on the "launch the preview in separate window" icon (image shown below) 3 -...

Close bootstrap modal if the button is not placed inside modal-body

jquery,html,css,twitter-bootstrap,bootstrap-modal
So, I have this modal I'm using for a full screen menu and the close button is working perfectly in this form: <div class="modal fade" id="hidden-links"> <div class="modal-dialog"> <div class="modal-content hidden-links"> <div class="modal-body"> <div data-dismiss="modal" aria-label="Close"> <i class="fa fa-times fa-fw fa-2x"></i> </div> <ul class="links-hidden" role="menu"> <!--Hidden links here--> </ul> </div>...

Clicking sub menu pop up a modal in wordpress plugin

javascript,jquery,wordpress,twitter-bootstrap,bootstrap-modal
I am working on a Wordpress plugin where I want to open a pop-up modal when I click on one of my plugin sub-menus. I can trigger the modal using a link or a button, but I want to load the modal at the time I click on the submenu....

Switching between tabs in modal in angular

angularjs,twitter-bootstrap,angularjs-scope,bootstrap-modal,angularjs-ng-click
I have a login and a signup form that opens in a modal. At the top I have two tabs switching between login and signup. see picture Switching between the tabs works fine. However, I want the user to be able to choose login as well as signup on my...

Angularjs ng-required not clear the notification after closing model

javascript,angularjs,twitter-bootstrap,bootstrap-modal
I am using Angularjs ng-required for form validation. When I am trying to save with blank form it shows error to fill values. After I close the model and reopen the model form validation notification is not getting cleared. SamplePlnkr Code ...

Why is bootstrap Modal not working

bootstrap,bootstrap-modal
I know this is a very basic problem, but I have looked around and really can't find a fitting solution. I'm very new to html and javascript, so bare with me... Here is the full HTML-code I'm using. The bootstrap cdn in the head and the rest in the body......

Open modal dialog based condition in select drop down

javascript,angularjs,select,modal-dialog,bootstrap-modal
I'm opening a modal dialog box on click of a button like this: <button type="button" data-toggle="modal" data-target="#openModal">Click</button> <div class="modal fade" id="openModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> //modal body </div> I would like to know whether is there any method with which one can open a modal dialog based on select drop...

bootstrap modal not displaying information retrieved

jquery,html,bootstrap-modal
I have a very basic simple modal which is provided by Bootstrap. I am trying to get this work but for some reason it does not return the value which is stored in the data-id and everything looks exactly the same as it does on the bootstrap tutorial. I don't...

Multiple modals with galleries vs. a single dynamic one

javascript,dom,seo,image-gallery,bootstrap-modal
Lets say we have a long list of posts on a single page. Each of those posts has a hidden div with multiple img tags inside it. When a user clicks on the post, the images inside the hidden div should be showcased in a modal gallery. Which approach is...

Bootstrap Modal doesn't toggle when I modal('toggle') on escape keydown

jquery,twitter-bootstrap,bootstrap-modal
I have a function that is supposed to toggle a bootstrap modal on and off by pressing the escape key. However, the toggle function only shows the modal. I have to manually click on the exit button to have it hide. $(document).keyup(function(e) { if (e.keyCode == 27) { $("#myModal").modal('toggle'); }...