I was contacted by a customer who thought the "Confirm" button didn't work. I, too, have experienced what he did. You click the button and nothing seems to be happening. If you wait long enough, though, the process continues.
I proposed that, when clicked, the "Confirm" button be replaced with a different graphic or words such as "Please wait". This will at least let the user know that something is happening. It might even be beneficial to have a spinning ball or other indicator that the page is being processed. As is, impatient people think it doesn't work.
I proposed that, when clicked, the "Confirm" button be replaced with a different graphic or words such as "Please wait". This will at least let the user know that something is happening. It might even be beneficial to have a spinning ball or other indicator that the page is being processed. As is, impatient people think it doesn't work.
I agree, there's been a couple times I thought the confirm button didn't work but it was just because my connection was slow..
I might suggest that Fido-X has a messages Mod that might be useful in this situation. You can create a message on the confirm page that says something like "Please click the confirm button only once". At least this might be a solution until something else comes along.
I might suggest that Fido-X has a messages Mod that might be useful in this situation. You can create a message on the confirm page that says something like "Please click the confirm button only once". At least this might be a solution until something else comes along.
Here's an example of how to do it with the current paypal standard...
the file is located at
As you can see, there's 4 lines added to the javascript at the bottom and this image html is inserted next to the button
The image can actually be placed anywhere, but works the same. This is live on my web store now for those that want to test it out
the file is located at
Code: Select all
/catalog/view/theme/your-theme-name/template/payment/pp_standard.tpl
Code: Select all
<!--
//-----------------------------------------
// Author: Qphoria@gmail.com
// Web: http://www.unbannable.com/ocstore
//-----------------------------------------
-->
<?php if (isset($error)) { ?>
<div class="warning"><?php echo $error; ?></div>
<?php } ?>
<?php if ($testmode) { ?>
<div class="warning"><?php echo $this->language->get('text_testmode'); ?></div>
<?php } ?>
<form action="<?php echo $action; ?>" method="post" id="checkout">
<?php foreach ($fields as $key => $value) { ?>
<input type="hidden" name="<?php echo $key; ?>" value="<?php echo $value; ?>" />
<?php } ?>
</form>
<div class="buttons">
<table>
<tr>
<td align="left"><a onclick="location='<?php echo $back; ?>'" class="button"><span><?php echo $button_back; ?></span></a></td>
<td align="right"><a onclick="confirmSubmit();" class="button"><span><?php echo $button_confirm; ?></span></a> <img class="confirm_image" src="catalog/view/theme/default/images/ajax_load.gif" style="display: none;" alt="spinner" /></td>
</tr>
</table>
</div>
<script type="text/javascript"><!--
var submitted = false;
function confirmSubmit() {
if(submitted) return;
submitted = true;
$('.confirm_image').css({'display': 'inline'})
$.ajax({
type: 'GET',
url: 'index.php?route=payment/pp_standard/confirm',
success: function() {
$('#checkout').submit();
}
});
}
//--></script>
Code: Select all
<img class="confirm_image" src="catalog/view/theme/default/images/ajax_load.gif" style="display: none;" alt="spinner" />
weak sauce...
Global solution:
1. EDIT: catalog/view/theme/default/template/checkout/confirm.tpl
2. FIND:
3. AFTER, ADD:
4. EDIT: catalog/view/theme/default/stylesheet/stylesheet.css
5. AT THE BOTTOM, ADD:
6. UPLOAD THIS FILE (or any other loading animation):
TO: catalog/view/theme/default/image/
Works for ALL form-based payment methods
Global solution:
1. EDIT: catalog/view/theme/default/template/checkout/confirm.tpl
2. FIND:
Code: Select all
<div id="payment"><?php echo $payment; ?></div>
Code: Select all
<script type="text/javascript">
$(document).ready(function() {
$('body').prepend('<div id="loading" style="display: none;">Loading...</div>');
var submitted = false;
$('#payment form').submit(function() {
if (submitted) return;
submitted = true;
$('div#loading').show();
});
});
</script>
5. AT THE BOTTOM, ADD:
Code: Select all
#loading {
background: url("../image/spinner3-black.gif") no-repeat scroll center center #FFFFFF;
border: 1px solid #666666;
font: 16px Tahoma,Geneva,sans-serif;
height: 100px;
left: 50%;
margin-left: -50px;
margin-top: -50px;
overflow: auto;
padding: 10px;
position: fixed;
text-align: center;
top: 50%;
width: 100px;
z-index: 2;
}
TO: catalog/view/theme/default/image/
Works for ALL form-based payment methods
ok I've cleaned up the mod (and the thread).
You can find a fully working dynamic version that works with all page loads and form submits here:
http://forum.opencart.com/viewtopic.php ... 86#p114186
You can find a fully working dynamic version that works with all page loads and form submits here:
http://forum.opencart.com/viewtopic.php ... 86#p114186
I like the checkout-only one myself...not that you'll see the loader for very long. My store is Not Magento.
Thank you again for a neat contribution.
Thank you again for a neat contribution.
Better: add a generaly delay, so the animation is not shown always (if the loading speed is less than x milliseconds).Qphoria wrote:perhaps I can add a magento-mode option (add 5-secs of delay to the script )
Instead of having:
use this (here 300 ms):$('div#body_loading').show();
setTimeout("$('div#body_loading').show()", 300);
Full Stack Web Developer :: Dedicated OpenCart Development & Support DACH Region
Contact for Custom Work / Fast Support.
I like this a lot. Thanks Q.
Is there a way to make the page darken like it does when you open an image with thickbox?
Maybe something like this in the stylesheet:
But how would we activate it?
Is there a way to make the page darken like it does when you open an image with thickbox?
Maybe something like this in the stylesheet:
Code: Select all
#loading_overlay {
position: fixed;
z-index:100;
top: 0px;
left: 0px;
background-color:#000;
filter:alpha(opacity=75);
-moz-opacity: 0.75;
opacity: 0.75;
height:100%;
width:100%;
I heart cmd-f, cmd-c, cmd-v, cmd-z + vQmod.
My favourite page...
v1.5.4.1
Hey guys, thanks to Qphoria for a great solution. I know this is an old thread, but I found that the last post before this one was in February, indicating OpenCart 1.4.x - I did not even know about OC back then and have OpenCart 1.5.0. I tried Qphoria's solution and of course it did not work on 1.5, but I just had to try and I was hoping.
Here is QPhoria's original code for confirm.tpl:
Change $('#payment form').submit(function() {
To: $('#button-confirm').click(function() {
That worked for me.
Bruce
Here is QPhoria's original code for confirm.tpl:
Which much struggling, I finally got it working for 1.5.0. Use Qphoria's solution and change one line of jQuery in confirm.tpl:Qphoria wrote:weak sauce...
3. AFTER, ADD:Code: Select all
<script type="text/javascript"> $(document).ready(function() { $('body').prepend('<div id="loading" style="display: none;">Loading...</div>'); var submitted = false; $('#payment form').submit(function() { if (submitted) return; submitted = true; $('div#loading').show(); }); }); </script>
Change $('#payment form').submit(function() {
To: $('#button-confirm').click(function() {
That worked for me.
Bruce
Correction to make it work: in Qphoria's step 3 insert this code instead:
Code: Select all
<script type="text/javascript"><!--
$('#checkout').click(function() {
$('body').prepend('<div id="loading" style="display: none;">Loading...</div>');
$('div#loading').show();
});
//--></script>
I tried making a vQmod for this, to use on 1.5.4.1, but it's not working.
Customers are getting really bad delays after clicking the Confirm Order button.
Any suggestions what to do?
Later edit: you can also check this: http://forum.opencart.com/viewtopic.php ... 71#p380371
Customers are getting really bad delays after clicking the Confirm Order button.
Any suggestions what to do?
Later edit: you can also check this: http://forum.opencart.com/viewtopic.php ... 71#p380371
I'm using Open Cart 1.5.4.1 on http://www.importpieseauto.ro
Who is online
Users browsing this forum: No registered users and 98 guests