jQuery validate select box with HTML value

Question

I am using jQuery Validation Plugin for form validation and I am not able to validate the select box using not the value fields but the text field..

Here my situation:

[HTML]

<form id="form">
      <select name="customPrice[0][50]" id="customPrice050">
                <option value="2435">Select date... </option>
                <option value="474">Friday, Mar 1st</option>
                <option value="475">Friday, Mar 8th</option>
                <option value="476">Friday, Mar 15th</option>
      </select>
      <br/>
      <input type="submit" value="Click" />

[jQuery]

$(document).ready(function()
{       
 // add the rule here
 $.validator.addMethod("valueNotEquals", function(value, element, arg){
  return arg != value;
 }, "Value must not equal arg.");

 // configure your validation
 $("form").validate({
  rules: {
   "customPrice[0][50]": { valueNotEquals: "2435" }
  },
  messages: {
   "customPrice[0][50]": {
    valueNotEquals: "Please select a date!"
   }
  }  
 });

 }

);

This works very well. The problem is that the value 2435 in not static and it always changes. The only static property is the text "Select date... ". Now I would something like:

"customPrice[0][50]": { textNotEquals: "Select date... " }

Can someone help me?

if you are using a recent jQuery, you could make a rule that checks the selected index of your select is greater than 0 $(...).prop("selectedIndex") > 0 stackoverflow.com/a/7373474/678338 — politus
– politus, Commented Mar 13, 2013 at 14:58
@politus - That's a great idea. Much better than depending on the text of the first option. — John S
– John S, Commented Mar 13, 2013 at 16:05

John S · Accepted Answer · 2013-03-13 13:47:46Z

1

The middle argument to the callback function is the element being validated. You should be able to use that to get the text from the selected option and check that it is not "Select date...".

Try this:

$.validator.addMethod("selectTextNotEquals", function(value, select, arg) {
    return arg != $(select).find('option:selected').text();
}, "Text must not equal arg.");

DEMO

edited Mar 13, 2013 at 13:47

answered Mar 13, 2013 at 13:12

John S

21.5k9 gold badges50 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery validate select box with HTML value

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related