I have a very strange problem.
Recently I've created an upload page using jquery form submit on an iframe (I don't want to refresh the page) and it worked perfectly.
When I put this code on my real page a weird problem appears.
I have a button with this code:
("#upload_button").click(function(){
$("form").submit();
})
But when I click it the whole page is refreshing and my user session disappears.
What could do this?
PS: My initial version works perfectly.
Oh yes.If I put a submit button it works too.But I want to do this submit with jquery on a div
Thank you!
Try to use not form tag, but form id parameter. Smth like $('#MyForm'). Using it this way will make you sure you are calling correct form.
Related
I have a multistep Drupal 7 form. I'd like to show it in a Bootstrap Popup.
This form works fine on a normal page however when I put it into a Bootstrap popup it closes the popup when the first button is pressed.
I use drupal_render(drupal_get_form('MYFORMNAME_form')) to put the form into the popup body.
How can I make this multistep form work properly in the popup?
when you say bootstrap popup, do you mean a modal window (http://getbootstrap.com/javascript/#modals)? Modals in bootstrap are defined inside the body of the page and just hidden/shown as needed. If you want one to act as its own window, you need an iframe in it, because submitting the form will not trigger whatever mechanism you put in place to show the modal dialog in the first place.
Another option is to use code to re-show the modal, with the form at whatever stage it is at, with each page load (next button, etc.)
A last option is to do all of the form navigation via AJAX. Then you don't ever need to put the form inside an iframe nor include code to re-show the modal with each submission of the form, since the page never gets refreshed.
IMHO the iframe is easiest, and a decent option if you don't have any qualms about iframes. You just need to place the form in a separate page and include it inside the iframe. Some theming work will enable you to turn off the normal page chrome that will make your modal look like a miniature version of your site -- you probably don't want your header, navbar, footer, etc. inside the modal.
You could use the Popup forms module. It claims:
Works well with multi-step forms. Just don't add [the] "Next" button id to
[the] 'close_buttons' array to keep [the] popup open [when navigating between steps].
This solution is not using a Boostrap Modal ("Bootstrap popup") though rather a jQuery UI dialog. It requires a bit of custom coding to use this module. Example code is provided on the project page.
I am working in ShortStack, makes custom FB tabs/pages. I searched like crazy, I saw tons of answers but none that address a non-traditional iframe. I didn't create the iframe, Shortstack did. I put my webform code in. After submit, does not go to top of next page.
Any suggestions as to type of code I could use? Shortstack support will not help since it is custom code I am putting in.
FB.Canvas.scrollTo(0,0);
You can use this to scroll to the top, just place it inside a code widget in the shortstack designer.
https://developers.facebook.com/docs/reference/javascript/FB.Canvas.scrollTo/
Example:
$('#promotion').bind('success.form', function(event) {
FB.Canvas.scrollTo(0,0);
});
I'm trying to display FB like button into facebox popup, but it is not working consistently for me, after opening popup multiple times, fb like button appears.
I also tried it with FB Like button - Iframe code, it works perfectly but in that case not able to fire edge create event.
Please help.
Thanks in Advance.
Finally found solution, problem was with the parsing...
Instead of parse only div where I was added like button code,
FB.XFBML.parse(document.getElementById("login1"));
I have just parse like below,
FB.XFBML.parse();
Now like button get display and
I have a link, it looks like that:
link text
The target (shop) is an iframe with the name shop. Clicking the link and showing someplace.html in the iframe only works, if the page that contains the iframe is already loaded.
So my problem is, how can I make it work even if the page that contains the iframe is not loaded? I tried loading the page with the iframe by redirecting to it when the link was clicked using its onclick, that worked, but I still have to load someplace.html afterwards and this is where I am stuck.
Any ideas how to solve that? I can use jQuery or plain JavaScript ... doesnt matter.
Thanks!
If you have a link with a target "shop", you must have a iframe called "shop". It is possible to load the iframe with a blank page if there is no initial content.
I'm adding facebook login buttons to fancybox (version 1.3.4) modals (one for join, one for login). The facebook buttons all get instantiated when the page loads, but are hidden. After triggering the fancybox login modal, the facebook buttons get rewritten in the modal and load correctly the first time. However if you close the modal and then reload it a second or third time, there is no facebook login button. It's just blank. When I look at the inline html block
that fancybox based the modal on, the facebook button markup that was generated when the page initially loaded is gone...actually not completely gone, but the button code deep in the iframe is wiped out.
I've seen suggestions to iframe these facebook buttons, so I tried adding an iframe instead of the raw facebook button markup. Note that I am not using the iframe fancybox type and I can't currently do that. When I include <iframe src="/myfacebookbuttonpage"></iframe> in the modal section, again it loads correctly the first time and then after closing the modal, looking at the source I can see the iframe rewritten as <iframe src="about:blank"></iframe> and the innards of the iframe are blank.
Anyone have any idea what's going on here? Or is this attempt to include facebook login buttons in fancybox modals completely wrong for some reason?
It's a bug in fancybox v1.3.2+ when using inline iframes.
As a work around, you may edit the fancybox js file or apply the workaround in your custom fancybox script.
Go here for further instructions