Javascript 引导验证程序和选择器
我想使用插件来验证我的表单。我的表单由许多其他表单(我使用的是django)组成。看起来是这样的Javascript 引导验证程序和选择器,javascript,jquery,django,twitter-bootstrap,validation,Javascript,Jquery,Django,Twitter Bootstrap,Validation,我想使用插件来验证我的表单。我的表单由许多其他表单(我使用的是django)组成。看起来是这样的 <form action="" id="register-form" method="post"> <div class="container bg-white"> <div class="tab-container"> <div class="tab-content">
<form action="" id="register-form" method="post">
<div class="container bg-white">
<div class="tab-container">
<div class="tab-content">
<div class="tab-pane fade in active" id="client-details">
<fieldset>
<legend>Personal Data</legend>
<span class="help-inline">This are your billing data</span>
<div class="form-group">
<label for="id_client-first_name">First name:</label>
<input class="form-control input-sm" id="id_client-first_name" maxlength="40" name="client-first_name" type="text">
</div>
<div class="form-group">
<label for="id_client-middle_name">Middle name:</label>
<input class="form-control input-sm" id="id_client-middle_name" maxlength="40" name="client-middle_name" type="text">
</div>
<div class="form-group">
<label for="id_client-last_name">Last name:</label>
<input class="form-control input-sm" id="id_client-last_name" maxlength="40" name="client-last_name" type="text">
</div>
<div class="form-group">
<label for="id_client-adress">Adress:</label>
<input class="form-control input-sm" id="id_client-adress" maxlength="40" name="client-adress" type="text">
</div>
<div class="form-group">
<label for="id_client-email">Email:</label>
<input class="form-control input-sm" id="id_client-email" maxlength="75" name="client-email" type="email">
</div>
<div class="form-group">
<label for="id_client-phone_no">Phone no:</label>
<input class="form-control input-sm" id="id_client-phone_no" maxlength="20" name="client-phone_no" type="text">
</div>
<div class="form-group">
<label for="id_client-mobile">Mobile:</label>
<input class="form-control input-sm" id="id_client-mobile" maxlength="20" name="client-mobile" type="text">
</div>
<div class="form-group">
<label for="id_client-no_of_doctors">No of doctors:</label>
<input class="form-control input-sm" id="id_client-no_of_doctors" name="client-no_of_doctors" type="number">
</div>
</fieldset>
</div>
<div class="tab-pane fade" id="user-data">
<div class="form-group">
<label for="id_personal_data-first_name">First name:</label>
<input class="form-control input-sm" id="id_personal_data-first_name" maxlength="30" name="personal_data-first_name" type="text">
</div>
<div class="form-group">
<label for="id_personal_data-last_name">Last name:</label>
<input class="form-control input-sm" id="id_personal_data-last_name" maxlength="30" name="personal_data-last_name" type="text">
</div>
<div class="form-group">
<label for="id_personal_data-email">Email:</label>
<input class="form-control input-sm" id="id_personal_data-email" name="personal_data-email" type="text">
</div>
</div>
<div class="tab-pane fade" id="practice-details">
<div class="form-group">
<label for="id_practice_data-name">Name:</label>
<input class="form-control input-sm" id="id_practice_data-name" maxlength="50" name="practice_data-name" type="text">
</div>
<div class="form-group">
<label for="id_practice_data-address">Address:</label>
<input class="form-control input-sm" id="id_practice_data-address" maxlength="50" name="practice_data-address" type="text">
</div>
<div class="form-group">
<label for="id_practice_data-postal_code">Postal code:</label>
<input class="form-control input-sm" id="id_practice_data-postal_code" maxlength="10" name="practice_data-postal_code" type="text">
</div>
<div class="form-group">
<label for="id_practice_data-phone_no">Phone no:</label>
<input class="form-control input-sm" id="id_practice_data-phone_no" maxlength="10" name="practice_data-phone_no" type="text">
</div>
<div class="form-group">
<label for="id_practice_data-city">City:</label>
<input class="form-control input-sm" id="id_practice_data-city" maxlength="10" name="practice_data-city" type="text">
</div>
<div class="form-group">
<label for="id_practice_data-logo">Logo:</label>
<input id="id_practice_data-logo" name="practice_data-logo" type="file">
</div>
</div>
</div>
</div>
<input type="submit" id="btn-register" name="register" class="btn btn-default btn-sm">
</div>
</form>
但它似乎不起作用,不会显示任何错误。唯一的错误是,当我开始在电子邮件字段中键入时,它会说它无效。但是如何添加额外的验证器呢?是因为有一个名字,而我也使用了选择器吗?文档中的任何地方都没有说名称总是覆盖选择器属性。有效!!我必须在引号中加上带破折号的字段。因此,在插件的字段部分,必须像
“client email”
一样放置字段客户端电子邮件
$("#register-form").bootstrapValidator({
fields:{
id_client_email: {
selector:"#id_client-email",
validators: {
remote:{
url:"/order/email_check_availability/",
message: "This email already exists"
},
notEmpty:{
message: "This field is required"
}
}
}
}
});