I've added some custom fields to our Quotevalet template, and used the class 'required' but they're not acting as required fields and are simply allowing the user to go through wihtout completing them.. do we have to explicitly tell QV these fields via javascript? I'd have thought the Javascript would simply be looking for the class name and doing the rest regardless of whether the field was custom or not?
Best Answer
M
Mike Krzenski
said
about 6 years ago
Hi Barry.
If I could venture a guess it probably has to do with the placement of the validationGroup class in relation to the fields that aren't working.
A quick bit about how the class is used first:
When you click a submit button (in this case the acceptance button) the validation code ascends the dom (from the submit button) looking for an element with the validationGroup class. Then, all form fields that are descendants of that element are included in the form validation.
So, if for instance you've placed these new fields outside that validationGroup (in another section for instance) then they would not be included in the form validation for the Quote Acceptance.
To correct this be sure the validationGroup class is attached to an element that is an ascendant of all the fields.
So, for example if you have two sections...wrap them in a single parent div and place the validationGroup class on that div. Then also make sure you've removed the validationGroup class from any of the descendants of that element. At this point all the fields should be included in the form validation when clicking the Acceptance button.
And this became mandatory, see below (ignore the field label name).
This looks to be exactly the same as what you have, so not quite sure what's going on.
Daft question, I'm sure, but you did reupload the quote after having made this change?
When previewing the page and "inspecting element" I can test this by adding the word "required" prior to 'textbox'. If I then try and accept, the field has become required.
(the last class textbox reference, not input type textbox)
B
Barry Jarvis
said
about 6 years ago
Hi Matt,
Yes, quote has been re-uploaded (and also a new quote generated just in case)...
Everything you have done, i have done, and it just acts like they're not required, except when i also add the class 'digits' (for example the phone number field).
If i add digits class and then type in letters, i get the relevant error message, if i then delete the letters so the field is blank again, then error message goes away but instead i get the 'required field' message. So it's partially working... but just not as it should me.
I'm guessing it's not browser specific, otherwise it would/wouldn't work for all fields.
Don't suppose you want to ping me over the code your HTML and I'll try it on my system to see if we get the same/different results?
Mike Krzenski
said
about 6 years ago
Answer
Hi Barry.
If I could venture a guess it probably has to do with the placement of the validationGroup class in relation to the fields that aren't working.
A quick bit about how the class is used first:
When you click a submit button (in this case the acceptance button) the validation code ascends the dom (from the submit button) looking for an element with the validationGroup class. Then, all form fields that are descendants of that element are included in the form validation.
So, if for instance you've placed these new fields outside that validationGroup (in another section for instance) then they would not be included in the form validation for the Quote Acceptance.
To correct this be sure the validationGroup class is attached to an element that is an ascendant of all the fields.
So, for example if you have two sections...wrap them in a single parent div and place the validationGroup class on that div. Then also make sure you've removed the validationGroup class from any of the descendants of that element. At this point all the fields should be included in the form validation when clicking the Acceptance button.
Hope this makes sense and helps.
B
Barry Jarvis
said
about 6 years ago
Hi Mike,
Thanks for the help... the additional context of how validation works made complete sense and helped a lot! thanks
Barry Jarvis
I've added some custom fields to our Quotevalet template, and used the class 'required' but they're not acting as required fields and are simply allowing the user to go through wihtout completing them.. do we have to explicitly tell QV these fields via javascript? I'd have thought the Javascript would simply be looking for the class name and doing the rest regardless of whether the field was custom or not?
Hi Barry.
If I could venture a guess it probably has to do with the placement of the validationGroup class in relation to the fields that aren't working.
A quick bit about how the class is used first:
When you click a submit button (in this case the acceptance button) the validation code ascends the dom (from the submit button) looking for an element with the validationGroup class. Then, all form fields that are descendants of that element are included in the form validation.
So, if for instance you've placed these new fields outside that validationGroup (in another section for instance) then they would not be included in the form validation for the Quote Acceptance.
To correct this be sure the validationGroup class is attached to an element that is an ascendant of all the fields.
So, for example if you have two sections...wrap them in a single parent div and place the validationGroup class on that div. Then also make sure you've removed the validationGroup class from any of the descendants of that element. At this point all the fields should be included in the form validation when clicking the Acceptance button.
Hope this makes sense and helps.
- Oldest First
- Popular
- Newest First
Sorted by PopularBarry Jarvis
Thought it might be wise to show the an example of a field:
Matt Rose ([email protected])
I just tried this...
[DH_ShipToPhone:InputType=TextBox, class="required textbox"]
And this became mandatory, see below (ignore the field label name).
This looks to be exactly the same as what you have, so not quite sure what's going on.
Daft question, I'm sure, but you did reupload the quote after having made this change?
When previewing the page and "inspecting element" I can test this by adding the word "required" prior to 'textbox'. If I then try and accept, the field has become required.
Matt Rose ([email protected])
(the last class textbox reference, not input type textbox)
Barry Jarvis
Hi Matt,
Yes, quote has been re-uploaded (and also a new quote generated just in case)...
Everything you have done, i have done, and it just acts like they're not required, except when i also add the class 'digits' (for example the phone number field).
If i add digits class and then type in letters, i get the relevant error message, if i then delete the letters so the field is blank again, then error message goes away but instead i get the 'required field' message. So it's partially working... but just not as it should me.
puzzling me this one!
Matt Rose ([email protected])
Barry Jarvis
No, it's blank ...
Matt Rose ([email protected])
#stumped
I'm guessing it's not browser specific, otherwise it would/wouldn't work for all fields.
Don't suppose you want to ping me over the code your HTML and I'll try it on my system to see if we get the same/different results?
Mike Krzenski
Hi Barry.
If I could venture a guess it probably has to do with the placement of the validationGroup class in relation to the fields that aren't working.
A quick bit about how the class is used first:
When you click a submit button (in this case the acceptance button) the validation code ascends the dom (from the submit button) looking for an element with the validationGroup class. Then, all form fields that are descendants of that element are included in the form validation.
So, if for instance you've placed these new fields outside that validationGroup (in another section for instance) then they would not be included in the form validation for the Quote Acceptance.
To correct this be sure the validationGroup class is attached to an element that is an ascendant of all the fields.
So, for example if you have two sections...wrap them in a single parent div and place the validationGroup class on that div. Then also make sure you've removed the validationGroup class from any of the descendants of that element. At this point all the fields should be included in the form validation when clicking the Acceptance button.
Hope this makes sense and helps.
Barry Jarvis
Hi Mike,
Thanks for the help... the additional context of how validation works made complete sense and helped a lot! thanks
-
No PDF's please
-
Optional item Selected or Not Selected
-
Using Javascript to display different language acceptance templates
-
change quantity in quote vallet
-
Creating a Dropdown List for Quantity
-
Payment Option Descriptions on Template
-
Youtube Videos Not Attaching to Line Items in QV
-
Hiding the shipping amount if 0
-
Javascript to hide shipping on QV template if 0
-
QuoteValet Template - Get Selected Value from Selected Dropdown not working..
See all 37 topics