jQuery validate (http://jqueryvalidation.org/) doesn't works
jQuery validate (http://jqueryvalidation.org/) doesn't works
Hi!
I have a problem with my project where i use jQuery validation plugin.
This is example of my form (i use Twitter Bootstrap):
<form action="/editprofile/save/" method="post" role="form" class="editprofileform">
<div class="col-xs-4">
<div class="form-group">
<label for="firstname" class="control-label">Your name</label>
<input type="text" class="form-control" id="firstname" placeholder="Your name" name="firstname" value="Evgeny">
</div>
<div class="form-group">
<label for="birthday" class="control-label" style="display: block">Birthday</label>
<select id="day_bth" name="day" class="form-control slct-day">
<option value="0" disabled="">Day</option>
<option value="1" selected="selected">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>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select id="mounth_bth" name="mounth" onchange="return Birthday()" class="form-control slct-month">
<option value="0" disabled="">Month</option>
<option value="1" selected="selected">01</option>
<option value="2">02</option>
<option value="3">03</option>
<option value="4">04</option>
<option value="5">05</option>
<option value="6">06</option>
<option value="7">07</option>
<option value="8">08</option>
<option value="9">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<select id="year_bth" name="year" onchange="return Birthday()" class="form-control slct-year">
<option value="0" disabled="">Year</option>
<option value="2000">2000</option><option value="1999">1999</option><option value="1998">1998</option><option value="1997">1997</option><option value="1996">1996</option><option value="1995">1995</option><option value="1994">1994</option><option value="1993">1993</option><option value="1992">1992</option><option value="1991">1991</option><option value="1990">1990</option><option value="1989">1989</option><option value="1988">1988</option><option value="1987">1987</option><option value="1986">1986</option><option value="1985">1985</option><option value="1984">1984</option><option value="1983">1983</option><option value="1982">1982</option><option value="1981">1981</option><option value="1980">1980</option><option value="1979">1979</option><option value="1978">1978</option><option value="1977">1977</option><option value="1976">1976</option><option value="1975">1975</option><option value="1974">1974</option><option value="1973">1973</option><option value="1972">1972</option><option value="1971">1971</option><option value="1970">1970</option><option value="1969">1969</option><option value="1968">1968</option><option value="1967">1967</option><option value="1966">1966</option><option value="1965">1965</option><option value="1964">1964</option><option value="1963">1963</option><option value="1962">1962</option><option value="1961">1961</option><option value="1960">1960</option><option value="1959">1959</option><option value="1958">1958</option><option value="1957">1957</option><option value="1956">1956</option><option value="1955">1955</option><option value="1954">1954</option><option value="1953">1953</option><option value="1952">1952</option><option value="1951">1951</option><option value="1950">1950</option><option value="1949">1949</option><option value="1948">1948</option><option value="1947">1947</option><option value="1946">1946</option><option value="1945">1945</option><option value="1944">1944</option><option value="1943">1943</option><option value="1942">1942</option><option value="1941">1941</option><option value="1940">1940</option><option value="1939">1939</option><option value="1938">1938</option><option value="1937">1937</option><option value="1936">1936</option><option value="1935">1935</option><option value="1934">1934</option><option value="1933">1933</option><option value="1932">1932</option><option value="1931">1931</option><option value="1930" selected="selected">1930</option>
</select>
</div>
<div class="form-group">
<label for="uemail" class="control-label">Email</label>
<input type="text" class="form-control" id="uemail" placeholder="Enter email" name="uemail" value="">
</div>
</div>
<div class="col-xs-4">
<div class="form-group">
<label for="sex" class="control-label">Sex</label>
<select class="form-control" id="sex" name="sex">
<option value="1" selected="">Men</option>
<option value="0">Women</option>
</select>
</div>
<div class="form-group">
<label for="uplace" class="control-label">Where are you from?</label>
<input type="text" class="form-control" id="uplace" placeholder="Введите город, улицу" name="uplace" value="" autocomplete="off">
</div>
<div class="form-group">
<label for="phone" class="control-label">Phone number</label>
<input type="text" class="form-control" id="phone" placeholder="+7 (901) 234-56-78" name="phone" value="">
</div>
</div>
<div class="col-xs-4">
<div class="form-group">
<label for="osebe" class="control-label">About you</label>
<textarea class="form-control" style="width: 100%; height: 182px" name="osebe" id="osebe" placeholder="A few words about you"></textarea>
</div>
<div class="form-group">
<div class="save_button">
<button type="submit" class="btn btn-default">Save</button>
</div>
</div>
</div>
</form>
And this is my JS:
$(".editprofileform").validate({
rules: {
firstname: {
required: true,
minlength: 3
},
uemail: {
required: true,
email: true
}
},
messages: {
firstname: {
required: "Enter your name",
minlength: "Your name is too short"
},
uemail: "Enter correct email"
},
errorLabelContainer: ".ferrors"
});
So it isn't work. What's a problem?
Topic Participants
webdizain
peter.aganyo