so I have a popup form that I used JQuery for. The Popup is not a Div
within the current back, but is actually a view from another
controller action. (posts/add). The problem is, when I submit the
form, it does store the data. However, instead of staying there on
the popup, the whole page redirects to the action of the form. (posts/
add).
So I have this:
<?php echo $html->link('Demo',
array('controller'=>'posts','action'=>'add'),
array('class'=>'popupButton'));
This is the link to the popup. Popup is generated from the Posts
Controller, and Add Action. The popup functionality is based on the
www.yensdesign.com example.
I'm then using the JQuery Form Plugin to submit the form. Right now,
just a simple function:
$(document).ready(function() {
// bind 'myForm' and provide a simple callback function
$('#theForm').ajaxForm(function() {
alert("Thank you for your comment!");
});
});
Below I've also included the YenDesign thing i"m using to create the
popup. Let me know if anyone has any thoughts!
------ Popup ----------
//SETTING UP OUR POPUP
//0 means disabled; 1 means enabled;
var popupStatus = 0;
var close = "<a id='popupContactClose'>x</a>";
//loading popup with jQuery magic!
function loadPopup(tag){
//loads popup only if it is disabled
if(popupStatus==0){
$("#backgroundPopup").css({
"opacity": "0.7"
});
centerPopup();
$("#backgroundPopup").fadeIn(400);
$('#popup').load($(tag).attr('href') + ' #theForm');
$("#popup").fadeIn(400);
$("#popup").append(close);
popupStatus = 1;
}
}
//disabling popup with jQuery magic!
function disablePopup(){
//disables popup only if it is enabled
if(popupStatus==1){
$("#backgroundPopup").fadeOut(400);
$("#popup").fadeOut(400);
popupStatus = 0;
}
}
//centering popup
function centerPopup(){
//request data for centering
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var popupHeight = $("#popup").height();
var popupWidth = $("#popup").width();
//centering
$("#popup").css({
"position": "absolute",
"top": "50%",
"left":"50%",
"margin-left": popupWidth / -2,
"margin-top": popupHeight / -2
});
//only need force for IE6
$("#backgroundPopup").css({
"height": windowHeight
});
}
//CONTROLLING EVENTS IN jQuery
$(document).ready(function(){
//LOADING POPUP
//Click the button event!
$(".popupButton").click(function(){
//centering with css
centerPopup();
//load popup
loadPopup(this);
return false;
});
//CLOSING POPUP
//Click the x event!
$("#popupClose").click(function(){
disablePopup();
});
//Click out event!
$("#backgroundPopup").click(function(){
disablePopup();
});
//Press Escape event!
$(document).keypress(function(e){
if(e.keyCode==27 && popupStatus==1){
disablePopup();
}
});
$('#popup a.close').live('click', function () {
// Fade out the overlayer
disablePopup();
return false;
});
});
Check out the new CakePHP Questions site http://cakeqs.org and help others with
their CakePHP related questions.
You received this message because you are subscribed to the Google Groups
"CakePHP" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected] For more options, visit this group at
http://groups.google.com/group/cake-php?hl=en
