So I'm using a some Jquery to help me rearrange the layout on the checkout page. Essentially I want to do the following:
1. Create a signup form on a website that allows me to collect the applicant's information which will then be passed over to the checkout page when they add "product" to cart (see the example here: http://apartmentfindersandiego.aldriena.com/applicant-registration.html
) ...no problem so far.
2. Then on the checkout page, I've got several custom fields that are added that the applicant will fill out...again, no problem.
3. I want to have the custom fields appear at the top of the checkout page before all the credit card information is gathered vs. being in the middle of the checkout page sandwiched between the applicant's credit card information being gathered (I'd like to group all the credit card information at the bottom). Again, no problem...i was able to do this with Jquery. I enclosed my custom fields that need to be filled out with a div that has an id="top_div". Here's the Jquery to rearrange the order of the layout:
4. So here's the problem. When I introduce the Jquery and switch the order on the layout, FoxyCart has suddenly stopped taking the information from the custom fields. Whereas if I don't use Jquery to change the order of layout on the checkout page, the custom field's information is gathered fine. Here are the 2 checkout page templates (they're both on a subdomain until I launch the website):
(this one has the Jquery to allow me to rearrange the layout)
(this one does not have Jquery and the custom field's values are collected no problem).
Any ideas why this is happening?