-
Posts
-
Hello
I read this post but still can’t seem to make the select elements validate properly.This is my live page –
If I hit the submit button it highlights the text areas a date picker in red, but not the required select elements. I’d like them to have a red border as well, please. I have 5 select elements that should be required. Using the Food restrictions or allergies? * question, in the form I’ve separated the items as noted in the Form Element Options description –
Please select,Yes – use Comments to describe,None
Please advise. Thank you in advance :)
Sorry, the URL didn’t work –
Yes, I’d like the border to go red just like the date picker and text fields. And of course make the validation work for the 5 select elements :)
Hi,
Add this to quick css:
.select.is_empty{ border:1px solid red!important; }Best regards,
Jordan ShannonOk, thanks, that answers one of two questions. How do I make the 5 select element validate properly, please?
Sorry, there’s a misunderstanding – I want the select border to be red only when the submit button is clicked and the element has not been validated – the css you sent makes it red on load, not on click of the submit button.
Hi, Jordan
I have set 5 select elements to be required, therefore, need validation but the user can click on submit and form gets processed, even though they are set to ‘is not empty’ for form validation. As per the other post, above, he got it to work and I need to do the same.Hi,
You are using a complete outdated version of Enfold (3.3.2). We currently are on version 4.4.1.
Please update to the latest version.To update to the latest version follow the simple instructions here. (Or if you want the super detailed explanation you can read this blog post)
Then the solution mentioned in the post will work without any CSS changes.
Best regards,
GünterHello, Gunter
I’ve cloned the live site and updated both WP and Enfold to the latest. I’ve added in the code and added in Jordan’s css and it’s still not working. Also, the form is still being processed when I hit the submit button without selecting a pulldown item for the 5 required select elements. Please advise. So, I still need to have –
1) Make the select elements validation work properly – they are not being validated.
2) A red border show up for the select elements (text filed and date picker are fine) when the submit button is hit and they have not made a selection.Thanks again!
Hi,
The select fields don’t return as invalid or empty because the first option (“Please select”) is considered as a valid choice. If you really need to show an error when the first option is selected, edit the config-templatebuilder > aviashortcode > contact > contact.js file and then look for this code around line 71:
if(value == '' || value == null)Replace it with:
if(value == '' || value == null || value == 'Please select')Don’t forget to purge the cache prior to checking the page.
Best regards,
IsmaelHi,
By default the dropdown doesn’t show a value “Please select” but it will always display the first value of the comma separated values in the “Form Element Options” field. If i.e. the values are “Option 1,Option 2,Option 3” the first value in the dropdown would be “Option 1” and not “Please select”. Thus there’s no general default value which would allow such a check out of the box. However we’ll look into it – maybe we can add a setting to add a “Default” value to the dropdown which returns null if selected.
Best regards,
PeterYes i see now – but I think that makes sense. To have a field that you can leave blank, because this way the 1st option is always included in the e-mail as a selection.
Thank you, all, for this input. So, basically, validation is not possible for a select element unless there is an option for a blank first element, but it would also be good to be able to not have a blank area, so this is a bit of a conundrum.
I modified the contact.js file, and replaced the original in the parent theme’s correct directory, cleared my cache and tried again and it’s still allowing me to submit and takes me to the thank you page, so validation is still not working.
Ok, I couldn’t help but think that this couldn;t work so I went back to the post I listed at the very beginning of this topic. I copied the users select text and pasted it into my form and now it works, not only does it not process the form but the borders go red on the ones left ‘inslected’. Here’s the syntax (for my site), noting that there must first be a pipe, followed by a comma, then all subsequent selections are separated by a pipe. Problem solved!!!!!!!!! :)
Please Select |, Everyone | No one | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16
Thanks, all!
- You must be logged in to reply to this topic.