Checkout tests do nothing

GeoffreyGeoffrey Member
in Bugs & Feature Requests edited March 2012
Hi. I just finished formatting our checkout template exactly as we want it, and I can't find any obvious problems. But I'm now trying to run some test transactions and the order submission button isn't doing anything. We're integrating with the PayPal Payments Pro gateway, and I've followed the instructions from your wiki correctly, as far as I can tell... granting 3rd party API permission, etc.

All that happens when we click the order submission button is that the checkout page refreshes, and it appears that nothing else has occurred. No transaction records, email receipts, or anything of the kind. This same thing occurs whether I'm using the test servers or live servers. And I don't see any errors in the webkit developer tools console. I've read in the forums that javascript errors can sometimes confuse the checkout, but I can't identify anything wrong in the jQuery I've used.

We're hoping to launch the new site on Friday, and the checkout most certainly needs to be functional for that. I'd be supremely grateful for any help here. You can view and test the site here:

http://216.70.97.105/

Many Thanks,
Geoffrey
Tagged:
Comments
  • sparkwebsparkweb Member, Integration Developer, FoxyShop, Order Desk
    edited March 2012
    I don't have an answer for your question, but I just wanted to say that your site is gorgeous. Looks absolutely amazing! I really like how you reorganized everything and gave it a fresh look and organization.

    There's only two things that I think might be a mistake - maybe a font thing. These are from Windows Firefox:

    Update: Phooey - trying to get too fancy with my pics. They're gone now....
  • Hi David. Thanks for the kind words! Say, for some reason, I can't see the screenshots you included, and the links direct to an XML error. In any case, if it's font layout stuff, I am aware that there's some browser debugging left to be done, and Firefox in particular is rendering some of my Fontdeck fonts too big or too small in some places. I'll be sure to fix those things soon. If it's something else though, I would be interested in seeing the screenshots you've tried to include here.

    Kind Regards,
    Geoffrey
  • lukeluke FoxyCart Team
    Wow. Let me echo what has already been said... very nice cart / checkout customization! It looks beautiful. Unfortunately, I'm not sure what's breaking it either. My hunch is that somewhere in this custom JQuery you've removed something that our system requires to function correctly. My recommendation would be to go through here and comment all this out and see if it starts working again. Then add small pieces back in one at a time and see who the culprit is.
    $(function(){
    
    $('table#fc_cart_table2 tr.fc_cart_item').reverseOrder();  
    
    });
    
    $('select.select_mo').customStyle();
    $('select.select_yr').customStyle();
    
    $('#fc_cancel_continue_shopping').appendTo('span#return-home');
    $('#fc_cancel_continue_shopping a').text( $('#fc_cancel_continue_shopping a').text().replace('Cancel and Continue Shopping', 'verdanttea.com homepage') );
    
    $('thead').remove();
    $('caption').hide();
    $('tbody').wrap('<table id="fc_cart_table2" cellspacing="8" cellpadding="8" />');
    $('tfoot').wrap('<table id="fc_cart_table3" />');
    $('#fc_cart_table3').unwrap();
    $('#fc_cart_table3').appendTo('#fc_cart_container_inner');
    $('#fc_cart_table2').wrap('<div id="cart-fixed-window" />');
    
    $('table tr td:nth-child(3)').each(function() {
    	var $this = $(this);	 
    	$(this).appendTo($this.parent().children('td:nth-child(2)').children('ul.fc_cart_item_options'));		
    });
    $('td.fc_cart_item_quantity').wrap('<li class="fc_cart_item_option fc_cart_item_qty" />');
    $('li.fc_cart_item_qty"').prepend('Quantity: ');
    $("td.fc_cart_item_quantity").each(function() {
      $(this).replaceWith(this.childNodes);
    });
    
    $('span.fc_cart_item_price_each').unwrap();	
    $('span.fc_cart_item_price_each').each(function(){                
    		var $this = $(this); 	
    		$this.appendTo($this.parent().children('td:nth-child(2)').children('ul.fc_cart_item_options').children('li.fc_cart_item_amount'));
    });
    $('span.fc_cart_item_price_total').remove();
    $('.fc_cart_thumbnail').unwrap();
    
    $('<hr />').appendTo('.fc_fieldset_container');
    $('#fc_complete_order_button').appendTo('#fc_data_entry_container');
    $('#fc_login_register_container').insertAfter('#fc_customer_billing_container');
    $('#fc_use_different_address').appendTo('#fc_login_register');
    $('#fc_payment_method_paypal_container').remove();
    $('#li_cc_cvv2').insertAfter('#li_cc_exp_month');
    $('#fc_help_cvv2').insertAfter('#cc_cvv2');
    $('#li_cc_number').append('<img src="https://secure.verdanttea.com/cache.php?fcsid=2k0rh0aqhc3hgfdci5bnsnnv27&amp;url=http://216.70.97.105/wp-content/themes/verdant_tea/_images/bg_ccards_small.png"; id="cards-small" alt="Visa, MasterCard, Discover, American Express" />');
    $('<span id="safe-order">Your Order is Safe &amp; Secure</span>').insertAfter('#fc_complete_order_button');
    $('#fc_complete_order_button').wrap('<div id="place-order" />');
    
    $('#fc_login_register_container').append('<div class="message"><h4>Your Information is Safe</h4><p>Verdant Tea uses 256 bit SSL encryption to protect your data.</p><p>We will never disclose your personal information for any reason whatsoever. Your contact information will only be used to process your order.  We take your trust seriously.</p></div>');
    
    $('#fc_payment_container').append('<div class="message"><h4>100% Satisfaction Guarantee</h4><p>We will send you an immediate order confirmation, followed by tracking info for your shipment.</p><p>In the unlikely event of a problem with your order, Verdant Tea will provide you with a full refund, no questions asked, no returns necessary.  </p></div>');
    
  • Thanks Luke. I'll debug line by line as suggested when I get into the office tomorrow. And thanks for the praise. I've been working very, very hard with my business partner over the past seven weeks to get this into shape. Great to see that it's almost done.

    You guys have been a huge help for me, by the way. I deeply appreciate the support and documentation you provide for Foxy!
  • GeoffreyGeoffrey Member
    edited March 2012
    Alright! I figured out the problem. Just couldn't wait to leave this for tomorrow. The culprit was this:
    $('#fc_cancel_continue_shopping').appendTo('span#return-home');
    

    Basically, the checkout was throwing up a question mark because I appended the whole #fc_cancel_continue_shopping div out of the form. And I can see now why it would be upset considering all these hidden session variables inside of it:
    <div id="fc_cancel_continue_shopping">
    		<input type="hidden" id="ThisAction" name="ThisAction" value="checkout" />
    		<input type="hidden" id="customer_id" name="customer_id" value="0" />
    		<input type="hidden" name="fcsid" value="bfmh63h7k0u69p9nsakhfb70l0" />
    		<input type="hidden" name="fc_csrf_form" value="2fnGxKxf3C2wC1jELeNRJDMYi6zXkBwcGNM8pb" /><input type="hidden" name="fc_csrf_id" value="form" /><a href="http://216.70.97.105/teas/yunnan-golden-buds/">verdanttea.com homepage</a>
    </div>
    

    All I had really intended to do with that append call was put the "cancel and continue shopping" link in the footer like Amazon does it. And I guess I neglected to see or remember that all of these hidden form inputs were inside of the div. In any case, I reworked my method for aborting the checkout and now have the thing fully functional.

    Thanks again for the suggestion Luke. I probably would've gotten to the point of realizing on my own that I needed to line-debug the JS, but I was feeling pretty discouraged today. Sometimes when working on something so closely, and so intensely, for so long, it's easy to lose perspective.

    But now, I'm quite pleased it's working!

    Cheers,
    Geoffrey
  • fc_adamfc_adam FoxyCart Team
    @Geoffrey,

    Glad you got it sorted! And good luck with final preparations for the launch!
  • lukeluke FoxyCart Team
    @Geoffrey hah, I totally understand! I can't tell you how many times I try "everything" and get frustrated only to remember the most important rule of programming... keep it simple. Just about every time my normal "quick" tricks to get something working don't work, I end up having to put together a very simple base case and then start adding to it. It's funny how some of the most important tricks we learn are the most basic (and easiest to forget). Maybe that's why pro athletes often go back to the basics every year as part of their training.

    We're excited to see this final product launch. We'd love to feature it as an example of how flexible our cart / checkout can be.
Sign In or Register to comment.