TypeError: $.validator.methods[method] is undefined

Question

I have some problem but I can't figure it out, I have see some examples and I have read few posts about this method, but still nothing.

I get error:

TypeError: $.validator.methods[method] is undefined

And belove that is:

result = $.validator.methods[method].call( this, val, element, rule.parameters )

That means that function doesn't have all parameters and that is what coused error.

1. question: What is worng with validation?
2. question: How to validate drop down list and radio buttons with jquery-validate lib?
3. question: What would be the most elegant way to send data to some php script with method post.

My JS code:

$("#userData").validate({
    errorContainer: "#errorbox",
    errorLabelContainer: "#errorbox ul",
    wrapper: "li",

    rules: {
        first_name:{
            require:true,
            minlength: 2,
        },
        last_name: {
            required:true,
            minlength: 2,
        },
        number_room: "required",
        email: {
            required:true,
            email:true,
        },
    },
    messages: {
        first_name:{
            required: "Please enter name!",
            minlength: "At least 3 characters is needed for name",
        },
        last_name:{
            required: "Please enter surname!",
            minlength: "At least 3 characters is needed for surname",
        },
        number_room: "Potrebno je izbrati sobo",
        email:{
            required: "Please enter email!",
            email: "The format of email is: [email protected]",
        }
    }

});

My html code:

<form id="userData" name="userData" method="POST" action="">
  <fieldset>
    <div id="errorbox"><ul></ul></div>
    <table width="450px">
      <tr>
      </tr>
      <tr>
        <td valign="top"><label for="cfirst_name">Name*</label></td>
        <td valign="top"><input type="text" id="first_name" name="first_name" maxlength="50" size="30" class="required"/></td>
      </tr>
      <tr>
        <td valign="top"><label for="clast_name">Surname *</label></td>
        <td valign="top"><input type="text" id="last_name" name="last_name" maxlength="50" size="30" class="required"/></td>
      </tr>
      <tr>
        <td valign="top"><label for="cnumber_room">Room number*</label></td>        <td valign="top"><select name="number_room" id="number_room" class="required">
            <option selected value="0"> Not choosen</option>
            <option value="1"> 1  </option>
            <option value="2"> 2   </option>
            <option value="3">3  </option>
            <option value="4"> 4   </option>
            <option value="5"> 5  </option>
            <option value="6"> 6  </option>
            <option value="7"> 7 </option>
            <option value="8"> 8  </option>
            <option value="9"> 9   </option>
            <option value="10"> 10   </option>
            <option value="11"> 11   </option>
            <option value="12"> 12   </option>
            <option value="13"> 13  </option>
            <option value="14"> 14  </option>
          </select>
        </td>
      </tr>
      <tr>
        <td valign="top"><label for="cemail">Elektronski naslov *</label></td>             <td valign="top"><input type="text" id="email" name="email" maxlength="50"   
                                                                                                                   size="30" class="required" /></td>
      </tr>
      <tr>
        <td colspan="2" style="text-align: center"><input class="submit" type="submit" value="Sendi"></td>
      </tr>
    </table>
  </fieldset>
</form>

Solution

You have a typo in first_name/required... missing d

Change:

 first_name:{
        require:true,
        minlength: 2,
    },

To

   first_name:{
        required:true,
        minlength: 2,
    },