I have a link on my page, which calls a login form inside Fancybox. Due to how scoping in the CMS "works", this needs to be called from a different page.
My first idea was to call it with AJAX, but the problem then, was that the page would redirect to the login page on submit, which is not what I want. It should simply refresh the current page.
My second idea then, was to iframe the form in. It's a bit more clumpsy, but seems to do the trick. Upon submit, it only refreshes the view in the iframe, instead of redirecting the user, which is one step forward
However, we still need to refresh the page, so that the content may be updated now that the user is logged in. I've tried binding a function to the .on(click)
of the <submit>
. I've also tried binding a function to onsubmit
on the form itself. I even tried inlining it. Neither seem to do squat.
Should I give up and my dream of being a Javascript developer and fall back on a life of crime, or is there actually a real way to do what I'm trying to do?
I am using Fancybox v1.3 and jQuery v1.7.2.
$('a#myLoginTrigger').fancybox({
type: 'iframe'
});
$('form#myForm').on('submit', function(){
alert('Sweet dude, I can run functions in here!');
// I assume this will refresh the entire page, not just the iframe
location.reload();
// This has no effect whatsoever
return false;
});
.on()
event handler. I can't really put it on the target page, as I want to manipulate the parent page (refresh the page). I hope that makes sense. I could possibly make it happen by triggering the.reload()
on theonClose
event, but that would require me to include jQuery and Fancybox on the page I'm calling so that I could force close it from there, and that whole story would just create unnecessary overhead.