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

Changing jQuery validation highlighting - nothing showing in Server Behaviours and scared to death of editing checkout.php

Thread began 1/28/2015 8:43 am by Nathon Jones Web Design | Last modified 1/29/2015 5:01 pm by Jason Byrnes | 840 views | 10 replies |

Nathon Jones Web Design

Changing jQuery validation highlighting - nothing showing in Server Behaviours and scared to death of editing checkout.php

How do I change the jQuery styling for the jQuery validation on our checkout page without...

1) wrecking the form
2) wrecking the validation
3) crashing our checkout page

?

When selecting WebAssist > Forms > jQuery Validation there are no validations set up even though they are set up.
It's all very confusing. Page attached.

Thank you.
NJ

EDIT: Aaarrggh! I knew it....

"While executing findServerBehaviours in DynAttribute.htm, a JavaScript error occured."

...when trying to change the style to "Cafe".

OK'd this, saved the page then uploaded to website. Now the validation doesn't display any warnings!
So I spotted that I need to upload Cafe.css to the webassist > jq_validation folder. Shouldn't this happen automatically?

Uploaded Cafe.css and when we refresh the checkout.php page it's still the old validation style but all of the validation warnings are now piled on top of the form fields.

Uploaded our backup of checkout.php to get things back to normal and await your assistance.

There is something fundamentally flawed about the jQuery validation option that you provide. It just doesn't work.

Hope you can help. Thank you.
NJ

Attached Files
checkout.php
Sign in to reply to this post

Jason ByrnesWebAssist

make sure that you have the latest version of eCart and Data Bridge installed.

we have done some hot fix updaters to those extensions in the past month so i suggest uninstalling them and reinstalling them to make sure you are up to date.

to change the validation style, I think I would create a test page with the jQuery validation style you wish to use, then edit the checkout page to change the style sheet pointer:
<link rel="stylesheet" href="webassist/jq_validation/Serene.css">

and then edit the jQuery script block:

var CheckoutWizard_Sharp_Default_Opts = {
focusout: true,
focusin: false,
change: false,
keyup: false,
popupClass: "Serene",
pointedAt: "middle",
fieldOffset: 0,
fieldMargin: 0,
position: "middle",
direction: "middle",
border: 0,
offset: 0,
closeText: "✖",
percentWidth: 100,
orientation: "left",
};



replace all of the options:

focusout: true,
focusin: false,
change: false,
keyup: false,
popupClass: "Serene",
pointedAt: "middle",
fieldOffset: 0,
fieldMargin: 0,
position: "middle",
direction: "middle",
border: 0,
offset: 0,
closeText: "✖",
percentWidth: 100,
orientation: "left",




with the options from the test page.

Sign in to reply to this post

Nathon Jones Web Design

Shouldn't I just be able to select a different style and it updates automatically? Otherwise, what is the point of the style selector drop-down menu?

The checkout form is really complex, and it also ties in with confirm.php does it not? Are you saying that I'll need to recreate those pages, and the jquery validation on both of them, and THEN change the style and THEN copy what it does to my actual checkout page?

That sounds mental.
NJ

PS. All extensions were/are up-to-date. If you release "hot" fixes (?) for things though, don't you e-mail customers with a notification?

Sign in to reply to this post

Nathon Jones Web Design

Originally Said By: Jason Byrnes
  and then edit the jQuery script block:

var CheckoutWizard_Sharp_Default_Opts = {
focusout: true,
focusin: false,
change: false,
keyup: false,
popupClass: "Serene",
pointedAt: "middle",
fieldOffset: 0,
fieldMargin: 0,
position: "middle",
direction: "middle",
border: 0,
offset: 0,
closeText: "✖",
percentWidth: 100,
orientation: "left",
};


replace all of the options:
focusout: true,
focusin: false,
change: false,
keyup: false,
popupClass: "Serene",
pointedAt: "middle",
fieldOffset: 0,
fieldMargin: 0,
position: "middle",
direction: "middle",
border: 0,
offset: 0,
closeText: "✖",
percentWidth: 100,
orientation: "left",



with the options from the test page.  



Those options are the same? I want the style to be Cafe, not Serene.

Hope you can clarify this procedure as it seems extremely complicated for something which, going by the extension, should just be a case of selecting a different style from a drop down.

If there is a general acceptance that this just doesn't work and, like other extensions that don't work (Server Validations), we have to hand code around it then I'd appreciate you just telling us that rather than have us spend hours cursing at your extensions for not doing what they're supposed to.

Thank you.
NJ

Sign in to reply to this post

Jason ByrnesWebAssist

Yes, those options in the example are the same, but in your actual code will be different, I'm nearly trying to highlight that the only thing that gets changed is the options inside the function, and not the function itself. those options will effect settings like arrow placement and such, not just the style.

so to recap:

create a test page with a small form.

add jQuery validation to it with the settings you wish to use on the checkout form.

copy the CSS link and use it on the checkout page inlace of the other style link

Copy the options inside the opts function, and paste them over the opts in the checkout page.

I can't say why it is not working when you try to edit it on your checkout page, but this should work as a work around.

Sign in to reply to this post

Nathon Jones Web Design

Originally Said By: Jason Byrnes
  I can't say why it is not working when you try to edit it on your checkout page, but this should work as a work around.  



It's because the jQuery style drop down menu option doesn't work.

Your workaround has worked but it would be nice to be able to use the extension properly - that is the purpose of it, is it not?

Thank you
NJ

Sign in to reply to this post

Jason ByrnesWebAssist

I'm not able to reproduce. that is why i supplied the work around.

Sign in to reply to this post

Nathon Jones Web Design

Should eCart be automatically uploading dependent files that are affected when you edit something like this?
I'm not sure how we're supposed to know which files we should be uploading.

Thank you.
NJ

Sign in to reply to this post

Jason ByrnesWebAssist

file upload is a function od Dreamweaver, not eCart.

there are settings in DW to force it to include dependent files, but to be honest, i trust DW to upload files as far as I can throw it.

Sign in to reply to this post

Nathon Jones Web Design

LOL!

When we make a change to a WebAssist extension though, how do we know what files have been updated and, subsequently, what we then need to upload?

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...