getting rid of lower bar in colorbox - javascript

I want to use colorbox to display a form. The form will have two buttons, one for submitting the form and one for dismissing the window created by colorbox.
I have been following the examples, particularly the so called Outside HTML (Ajax). It works, but I am trying not to show the close button and to hidden also the whole bar that colorbox uses to display the title and other button for galleries.
If I set closeButton:false, the close button is not shown but I still have some white space at the bottom that I'd like to remove.
Do you know how to achieve this?

Related

Html, form with next button going to another form that saves data in javascript

Okay so, I'm making a multiple form page and I need it so there is a next button and once you click the button it hides the first form and opens the second, then hides the second shows the third, etc.. And as its doing this its adding previously set values together and will output them after the final form, I don't want it to go onto another page, just stay on the same page.
I have the forms created but for some reason I cant work out the logic for the javascript with adding values and hiding and showing forms, thanks in advance.

How to position a bootstrap modal to open from where the button is

I am new to bootstrap and AngularJs.
I am trying to use bootstrap modal dialog box to display additional details in a column of a table. I want the bootstrap modal to popup from where the details button in every row is but I can't seem to change the default position of the modal. It always pops up at the top and not where the mouse was clicked. Is there any way to re position it so that it pops up from right where the button is so that it looks more relevant to a particular element and less like an alert box.
Thanks.
use tooltip with html template and you can change the trigger to click so it will resolve your problem

Bootstrap Modal closing when any modal inside is closed

I am using basic bootstrap modal inside which there is a summernote text area. Problem is when I click on the insert picture button in summernote, it again opens a modal to choose the picture, but if I click on the modal close button of the summernote picture modal without choosing the picture, it closes the main modal too.
I don't want to close the main modal when modal close of the picture modal is clicked. Any help would be appreciated....
Check that these modals do not share the same id attribute
Also check that they do not share the same name attribute
you can give them separate names manually (like numbers: modal1)
you can also name them automatically with your server-side language when creating them, or with JavaScript upon load, but remember to reference these names correctly in the references, buttons & functions that close them.
#argon 's solution didn't work for me.
But I found this solution (provided here):
('#HtmlContent').summernote( {
dialogsInBody: true,
});

Onclick not working in panel after page change

I'm creating a small webapp using jquery mobile and php. I have an issue where I have a menu in a panel which i need to run an onclick event from. This works fine when the page has been re-loaded either using data-ajax='false' or running a page refresh. However when I try to use the event after a page change it just doesn't respond at all.
Here is my onclick code
$('#searchOptionMap').click(function()
{
window.alert("map clicked ");
});
and you can see the js fiddle here http://jsfiddle.net/jbcvnz0p/
If you go to page 1 - panel click - map click the alert appears
If you then navigate to page 2 - panel click - map click the alert doesn't appear
If you stay on page 2 and click the map collapsible - alert appears
You can see that the same onclick event works for a collapsible set outside the panel, just not within it. Is there any fix for this other than using data-ajax='false' or running a page refresh?
You have two divs with the same id, when you bind something with jQuery using an id, it only does the first one.
$('#searchOptionMap').click(function()
{
window.alert("map clicked");
});
So use a class instead, or make the panel external if it's going to be the same panel for both pages.
(#searchOptionMap2 works in this case because there's only one of them)

How to collapse a pop-up when you click somewhere else

I have custom form like element made with javascript. It works a bit like the HTML select. I.e. clicking on its pull-down control displays a pop-up of options and when you click on an option, the pop-up collapses.
I would also like to collapse the pop-up when you click somewhere else on the page. E.g. another control. At the moment I have a click event attached to the body element to do this, but it doesnt seem like the correct way to do it. Any suggestions for a better way to detect when to collapse the pop-up?

Categories

Resources