Javascript Help Needed WordPress
- SOLVED
Hi,
I'm implementing a popup on my site using the Platinum Popup plugin. The trouble: there is a form to submit within my popup and I need users to be directed to a thank you page within the popup as soon as they hit "submit." Currently, the thank you page replaces all the content within the current window even when I specify "target=_self".
My research suggests that I need to add an onSubmit function within the javascript of the plugin. However, I'm not sure exactly what the function should look like or where it needs to be added.
The plugin -- Platinum Popup Lite -- is a free download found at http://platinumplugins.com/ppl-p/. Alternatively, I'm happy to email the zip file for the plugin to anyone willing to look into this issue.
Any assistance is much appreciated!
Answers (3)
Andrzej answers:
Ok, so here's what you do. It's a bit complicated with this plugin, myself I'd use like a Fancybox with an iframe. However here's solution for Platinum Popups:
Add this code to your theme's functions.php:
function my_popup_javascript() {
?>
<script type="text/javascript">
jQuery(function($) {
$('.pp-onclick').click(function() {
$(".pp-content-frame form input:submit").click(function() {
$('.pp-content-frame form').submit(function() { return false; });
var formAction = $(".pp-content-frame form").attr("action");
var str = $(".pp-content-frame form").serialize();
//<![CDATA[
var serialized = str + "&action=" + formAction;
// ]]>
$.ajax({
url: formAction,
type: "POST",
data: serialized,
success: function(data){
$(".pp-content-frame form").html('All done.');
}
});
});
});
});
</script>
<?php
}
add_action('wp_footer', 'my_popup_javascript', 999);
And you're done.
Quick note: you need to have jQuery enabled in your theme for this to work.
Andrzej comments:
Other solution (maybe that's more flexible for you), would be creating a form in some single HTML page, and using "Display an External Web Page:" instead of WYSIWYG. Then just link your page there, and content would be displayed inside an iframe, so you can use target="_self" on your form successfully.
sheas comments:
Hi Andrzej,
I think you're second solution should work (the first idea did not). However, I'm running into one other issue when formatting the html. My alignment is completely off when the popup displays in firefox 2.0 in areas where I'm using the "display: inline-block" command. I tried using the fix "display:-moz-inline-box;" but that just made things worse. Any ideas?
Thanks much!
Andrzej comments:
Hi,
I'm happy it works for you.
CSS changes are however out of scope so if you'd like additional work can you pls increase the budget for another hour?
Hope that's ok
Thanks,
Andrzej
sheas comments:
I was actually able to figure it all out, but thanks for your help on this original question. It turned out great!
Arafat Rahman answers:
I am interested to help you. Send me the zip file and the URL of your site.
sheas comments:
Hi Arafat,
I just sent the file to your gmail address. I don't have a url to share at this time, however, because I'm testing it on a site that's not yet live. Let me know if you have any other questions. Thanks!
