Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 473
  • Last Modified:

How do I display an error message? -- <select> using jQuery form validation

Hi,
 I have a form using jQuery validation. The form displays an error message for each required <input> if the user hasn't filled it out. For the <select> items, the form validates, but it doesn't display an error message if the user hasn't selected an item from the from the dropdown. Can you write a rule that would display a message for the two form selects in my form. See attached code. I just want the message to say something like "Please select an item".
Thanks!
form-page.html
0
ron4721
Asked:
ron4721
  • 8
  • 5
  • 3
2 Solutions
 
Michel PlungjanIT ExpertCommented:
If you want to use the standard validation, to validate for not filled in or selected, the value has to be empty.

You have value="0"

<select id="state-terr" name="state-terr" class="required" title="Please select a State/Province/Territory.">
  <option value="0" selected="selected">--Select--</option>

So EITHER make that empty OR write a custom validation (could be as simple as testing that selectedIndex <1)
0
 
Eddie ShipmanAll-around developerCommented:
Personally, I use the jQuery ValidationEngine plugin. Very easy to use and does this for you.

http://github.com/posabsolute/jQuery-Validation-Engine
0
 
Michel PlungjanIT ExpertCommented:
I am sure that validator ALSO needs a custom validator for a select with the first option not empty.
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
Eddie ShipmanAll-around developerCommented:
It has many default validation rules.
0
 
ron4721Author Commented:
Hi EddieShipman,
I tried adding the jQuery ValidationEngine plugin to my page. So far i got this error in Firefox:

TypeError: form.on is not a function


any ideas?
Thanks.
0
 
Eddie ShipmanAll-around developerCommented:
Nope, what line? Do you have an accessible site where I can look at the source?
0
 
ron4721Author Commented:
I put these in my doc:
<script src="/js/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script>
<script src="/js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>

Open in new window


Then, i added this:
<script>
$(document).ready(function(){
        $("#apForm").validationEngine();
});
</script>

Open in new window


I got this error in Firefox:
TypeError: form.on is not a function
(the above error points to this line in the "jquery.validationEngine.js" file)
       
form.on(options.validationEventTrigger, "["+options.validateAttribute+"*=validate]:not([type=checkbox]):not([type=radio]):not(.datepicker)", methods._onFieldEvent);
	form.on("click", "["+options.validateAttribute+"*=validate][type=checkbox],["+options.validateAttribute+"*=validate][type=radio]", methods._onFieldEvent);
	form.on(options.validationEventTrigger,"["+options.validateAttribute+"*=validate][class*=datepicker]", {"delay": 300}, methods._onFieldEvent);

Open in new window



Hope this helps.
Thanks again.
0
 
Eddie ShipmanAll-around developerCommented:
Try this instead:
$("#apForm").validationEngine("attach", {scroll: true});

Open in new window


You need to 'attach' the validation to the form. The scroll option makes the page scroll to the field that has the error.
0
 
ron4721Author Commented:
Hi Eddie,
I tried the above, but i still get the same "TypeError: form.on is not a function" error.
0
 
Eddie ShipmanAll-around developerCommented:
What version of validationEngine do you have?
0
 
Michel PlungjanIT ExpertCommented:
and do you load jQuery first?
0
 
Eddie ShipmanAll-around developerCommented:
Yeah, forgot that part!!
0
 
Eddie ShipmanAll-around developerCommented:
It may also depend on the version of jQuery that you are using. I see that ValidationEngine version 2.6.1 has that code because I couldn't find that code in my 2.2.version.
0
 
Eddie ShipmanAll-around developerCommented:
Would it be possible for you to mockup a page and post it on jsfiddle?
0
 
ron4721Author Commented:
Hi Eddie,
 I'm using version 2.6.2 of Validation Engine. I'll update my jquery to jquery-1.8.2.min.js and see if that works...i'll let you know shortly....
thanks again :)
0
 
ron4721Author Commented:
Hi Eddie,
 Yep! I needed to update my jquery to 1.8.2. Now it works!! And it looks great. I like how the email address gets validated without adding any extra script.  Thanks again!!!
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 8
  • 5
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now