close ad
Install the LAtest Updates to Work with CC 2017 and CC 2018
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Working methodically - checkout.php - problems all over the place with it.

Thread began 4/04/2014 6:47 am by Nathon Jones Web Design | Last modified 4/25/2014 11:51 am by Nathon Jones Web Design | 20942 views | 30 replies |

Nathon Jones Web Design

Working methodically - checkout.php - problems all over the place with it.

Thank you for your call yesterday Jason. That has settled any confusion over how the Checkout Wizard works. If you don't mind, I'd like to work through my pages methodically with you in order to resolve any outstanding issues, of which there are many...starting with checkout.php.

https://www.ledwarehouseuk.com/shopping-basket.php > https://www.ledwarehouseuk.com/checkout.php

1) For the life of me, I can't get my card graphics to sit aligned with the radio button the way the PayPal icon, opposite it, is. Is this something to do with the numerous formList, forItem, formGroup references and their associated CSS stylings? I've tried putting it all into a table, with two columns, but it's still all over the place. How do I fix that?

2) When I select the PayPal payment option, the Shipping form slides up and obscures the Billing form, however the Group Header for the Billing form remains rendering the Shipping Group Header unreadable.

3) How do I prevent the Billing form overlapping the Billing Group Header? The Shipping form is doing something similar, but not as noticeably.

4) How do I modify the jQuery Validation for any of the form fields? For example, 10 digit telephone number isn't relevant.

5) I have moved the "Company_Name" field below the "Phone" field on both the Billing and Shipping parts of the form and have changed the label text to "Mobile", however I have not changed the name of the form field itself for fear of wrecking the form and subsequently causing problems on the receiving action page/s or the jQuery Validation for that field. Is it safe to change that form field name and will the subsequent page/s pick up on that change automatically?

6) The form field labels appear to be top aligned to the form fields. How do I vertically align those so that they look more in balance?

7) Can I have the Billing and Shipping forms pre-populated with a logged in users billing and shipping addresses? At the moment I assume both fields default values are set to retain the validated entries so I was concerned about overwriting those.

8) If I click "Same as Billing" and it fills in the Shipping form but I THEN notice a change in the Billing form, correct that change, and then untick and re-tick the "Same as Billing" checkbox...well...try it yourself. BOTH forms disappear and we are now faced with the Order Confirmation and Payment Info sections.

9) Oh, and the Payment Info Group Header is being overlapped by the payment info form - much like the Billing and Shipping Group Headers.

10) When I click "Continue" we get the "Please wait" progress bar and nothing else happens from that point on.

Hoping you can help us with these issues.
Thank you
NJ

Sign in to reply to this post

Jason ByrnesWebAssist

1) move the checkbox into the span that contains the CC images. on the checkbox tag, add margin-top 15px and margin-right 10px


2, 3, 9) These appear to be issues with conflicting CSS though am not able to find the conflict. try detaching your design CSS to see if the problem persists, I know that this behaivor does not hapoen to the checkout pages as they are gererated by the wizard, so there must bee something i nthe CSS you are adding afterwards to cause the behavior

4) go to WebAssist -> Forms -> Jquery validation to edit the jquery settings for the form

5) changing the labels is fine, but do not change the form element names

6) i dont follow, the labels look properly aligned to me, at any rate, any change to the positioning of the labels would be done by editing the CSS

7) yes, you can prepopualte the form elements by chaning the value, for example the email field:

value="<?php echo(WA_coalesce(array(WA_getSavedFormValue("CheckoutWizard_Sharp_Default","Email_Address_2"),(isset($_GET["invalid"])?ValidatedField("confirmcart","Email_Address_2"):"")))); ?>"


this uses a ternary expression, you can add a recordset referance to the last argumet:
value="<?php echo(WA_coalesce(array(WA_getSavedFormValue("CheckoutWizard_Sharp_Default","Email_Address_2"),(isset($_GET["invalid"])?ValidatedField("confirmcart","Email_Address_2"):$row_reccordsetName['ColumnName'])))); ?>"

8, 10) I'll need to troubleshoot directly, see the private message section.

Sign in to reply to this post

Nathon Jones Web Design

1) Have done that, but now it's out of line with the PayPal radio button and if I try to move the PayPal radio button into its associated span then the Billing Address Group Header goes all wonky! (wraps around them both)

2, 3, 9) Completely removed our CSS and the problem remains. I'm not convinced that it's related to our stylesheet which is, really, only styling the header and footer sections.

4) Thank you.

5) OK

6) They are top aligned in IE11. I'll check the CSS.

7) Does it matter that you've removed the quotes at the end of the first ternary expression?

value="<?php echo(WA_coalesce(array(WA_getSavedFormValue("CheckoutWizard_Sharp_Default","Email_Address_2"),(isset($_GET["invalid"])?ValidatedField("confirmcart","Email_Address_2"):"")))); ?>"

value="<?php echo(WA_coalesce(array(WA_getSavedFormValue("CheckoutWizard_Sharp_Default","Email_Address_2"),(isset($_GET["invalid"])?ValidatedField("confirmcart","Email_Address_2"):$row_reccordsetName['ColumnName'])))); ?>"

..so you've replaced the double quotes with $row_reccordsetName['ColumnName']

8, 10) See below.


PS. I've just noticed that there are now problems with the Country and State fields in both forms. I basically just want a drop down menu for Scotland, Wales, Northern Ireland and England for Country and an input text field for State. I was worried about deleting the Countries out, as you'd previously advised, because it struck me that the State field was dependent on selections in the Country menu.

Sign in to reply to this post

Jason ByrnesWebAssist

1) add:
style="margin-top:10px;"

to the div that contains the paypal logo

2) the real test is to go back to the unchanged checkout pages before you added your design to it. test the pages before adding your design.

in all reality, most stores use a very basic page design for the checkout pages, no menus, or footers, just a basic header, a link to the home page and the checkout details. a full page design is not needed on the checkout pages, by having all the footer links and the main navigation and other bells and whistles, you give the customer more options to back out of the checkout process and abandon the order


6) I dont see them being top aligned in IE 11, but still, position changes are done by editing the CSS

7) "..so you've replaced the double quotes with $row_reccordsetName['ColumnName']"
yes, that is correct

the other issues I Will have to look at a little later as I have other customers to attend to.

Sign in to reply to this post

Nathon Jones Web Design

1) Thank you.

2) We've removed our stylesheet. The only other stylesheet on the page is for CSSMenuWriter! :(
This isn't a bells and whistles page Jason, it's a header, content and footer layout, very basic, with CSSMenuWriter navigation.

I, and crucially, my client really like the integration with the existing page styling. If I strip everything out and leave only what's been created by the Checkout Wizard, would you agree to take a look at it for us?

(http://www.ledwarehouseuk.com/template-nothing.php - checkout page with nothing on it at all apart from the checkout functionality)

Everything else) Will wait to hear from you. Thank you.

NJ

Sign in to reply to this post

Jason ByrnesWebAssist

I have forwarded this to Ray to ask him to take a look, I'll let you know when i hear something back.

Sign in to reply to this post

Jason ByrnesWebAssist

Ray said he would give a call through Skype a little later to troubleshoot.

Sign in to reply to this post

Nathon Jones Web Design

Thank you Jason. I'll wait to hear from Ray.
NJ

Outstanding Items...

1) Selecting PayPal as the payment option no longer hides the billing address.

2) Odd overlapping form and group header.

3) Country and State - previously the State field would change to a text input field but now it remains as a drop down even though we've removed countries that have state options.

4) We have a recordset (rsUSER) on the checkout page that pre-fills the billing form is a user is logged in. However, this recordset is throwing the following error at the foot of the page:
Warning: mysql_free_result(): 17 is not a valid MySQL result resource in /home/led2014/public_html/checkout.php on line 710
We have this recordset on other pages of the website but the error only occurs on the checkout page.

5) We changed the jQuery Validation for the 2 telephone number fields but when we try to submit the form now it keeps asking us to enter a telephone number.

Appreciate the help, thank you.
NJ

Sign in to reply to this post

Jason ByrnesWebAssist

mention these to Ray when he contacts you.

Sign in to reply to this post

Nathon Jones Web Design

Just finished speaking with Ray and we got to the bottom of most of the issues. He said to post in here for any others.
http://www.ledwarehouseuk.com/checkout.php

1) Still having a problem with the jQuery Validation on the phone number fields. I want to allow only numbers and spaces but when I edit the validation via WebAssist > Forms > jQuery Validation it doesn't update.

2) When I click "continue" (non PayPal) I am shown an address just above the Payment Info header. This only appears to be the billing address though. How do I display the shipping address (Delivery Information)?

3) When I click "continue" (PayPal) I'm back to having jQuery Validation problems again and it doesn't submit. Again, only one address is listed.

Appreciate the help, as ever. Thank you.
NJ

Sign in to reply to this post
loading

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...