I have button that when I click on it I get "pop up window" (use boostrap modal) with data. I used twitter boostrap tooltip and everything works fine. when I decide replace the tooltip by popover I get some strange problems. first of all I want popover show up when I hover a link but it appear only when I click on the link. secondary the popover appears on the main window and don't disappear no metter what I try. I just want him appear on the boostrap modal like my last tooltip.
this is my link:
link
js:
$('.blob').popover();
how can I fix it? what wrong?
You spelled trigger incorrectly, should be:
link
With that corrected it works fine in jsfiddle for me.
Not sure why the data-trigger attribute isn't working, but passing the option using the JS initialization parameter makes it behave as you intend:
$('.blob').popover({trigger: "hover"});
jsfiddle here:
http://jsfiddle.net/dcasadevall/S8sXQ/1/
Related
I'm trying to open a form with bootstrap modal, my first problem was that bootstrap modal disappear immediately after click on my button but searching in other questions I found the solution deleting from my template:
{!!Html::script('js/plugins/bootstrap.min.js')!!}
Now I have other problem, the form of modal open but I can not do nothing, I can not submit my form, I attached a file with photo.
It's all dark and I can not do nothing.
How can I fix this problem?
Is a problem if I deleted bootstrap.min.js ?(I'm afraid that after something goes wrong)
There other way to create modal form? (maybe javascript)
Thank you for your help!
Your modal is may be inside some other div , that is affecting it . Try putting it outside that div it will work !! Or try putting this in your css file it may work div.modal div.modal-backdrop {
z-index: 0;
}
I followed the below post which helped in creating the dropdown accordion.
Twitter Bootstrap: How to create a dropdown button with an accordion inside it?
However the dropdown doesn't close back and behave normally when I execute a javascript function from any of its <a> tags.
Updated fiddle with the issue.
jsFiddle with Bootstrap example code
http://www.bootply.com/rbuS0mHLvd
check out this link if it will help.
If not then please explain the problem in detail with this code relevant to your code.
Basically i have removed the data-toggle=collapse as it will add the "in" class to your dropdown by which the dropdown is opened untill the class "in" is removed.
Here is a plunker http://plnkr.co/edit/2Fs6vCciXRRc7GeUwyR2?p=preview
Is anyone could help to advise why the calendar button is not working?
However clicking the calendar textbox showing calendarpopup just fine.
It seems that scope.$watch('isOpen', function(value) { ... }
not working anymore when datepicker is inside accordion and using calendar button.
many thanks in advance,
Ferry
There was one issue in your plunker - as noticed by #Daniel Dawes you need to use is-open instead open, as documented: http://angular-ui.github.io/bootstrap/#/datepicker
Then, the problem of the calendar being cut off in the last accordion is due to the Bootstrap CSS. You can around this by using the datepicker-append-to-body="true" attribute.
Working plunk here: http://plnkr.co/edit/3d3CX25eNbUvv5U8qiV8?p=preview
I have a application where i make all Divs clickable by using this code :
$("html").click(function(){
alert("Click");
return false;
});
This one work normally for all divs. Well, when Alert popup, the Background behind alert box cannot be clicked. How can i turn that to be clickable too?
PS: Right Click on the Background dont work too.
Thats not possible. You have to use a JS plugin doing the alert, so you can influence the behaviour (like the jquery ui modal widget, mentioned here). But with the browser alert this is not possible, as far as i know.
Not sure how to do exactly what you're asking (if it's possible). Maybe someone else can shed some light on that.
But a solution you could look into would be the dialog widget from jQuery UI. You can easily create pop-ups, modal or non-modal (meaning with the background faded out or not).
http://jqueryui.com/dialog/
They have some demos there, but it's as simple as created a div with some text and calling...
$("#the_div_id").dialog();
Other config parameters can be found from the API:
http://api.jqueryui.com/dialog/
By default its modal popup behaviour ,If you want to clickable
Assuming you are using Jquery Ui dialog
Try with the option modal
$('#selector').dialog("option","modal",false);
http://api.jqueryui.com/dialog/#option-modal
I'm having trouble with my dropdowns after upgrading to Bootstrap 2.1.1.
The very first dropdown on my page works fine. Opens correctly when clicked on, then closes when clicking on either an item, the dropdown header or the page.
However, the second and third dropdowns (I'm guessing any dropdown other than the first) on my page don't work correctly.
They don't close when clicking on an item, page or their header.
I looked around for a bit and found the following snippet, which I didn't need before:
$('.dropdown-toggle').dropdown();
When I include this in my code, the second/third dropdowns do close when clicking on the page or on an item. They still don't work when clicking on their header.
The HTML for these dropdowns is exactly the same as the HTML for the first one. I can't find any differences, nor an explanation why only the first dropdown works correctly.
I have put some code on JSfiddle here: http://jsfiddle.net/3CysL/1/
You are linking dropdown triggers with their parent, the dropdown container.
This is breaking your triggers, so change:
href="#media" -> href="#"
href="#tools" -> href="#"
href="#language" -> href="#"