这些文件链接到我的页面
我正在使用visual studio Web应用程序。我有一个母版页，其中在标题处添加了这些文件。
<link href="../StyleSheets/default.css" rel="stylesheet" />
<!--<script src="../Scripts/jquery-1.11.3.min.js"></script>-->
<script src="../Scripts/jquery-1.7.1.min.js"></script>
<link href="../StyleSheets/bootstrap/css/bootstrap.css" rel="stylesheet" />
<link href="../StyleSheets/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<script src="../Scripts/jquery.validate.js"></script>
<script src="../Scripts/script.js"></script>
此处我的表单代码
这是StudentApplication Form
<form id="Student_portal">
<div class="jumbotron">
<div class="form-group">
<div class=" control-group">
<div class="header">COURSE OF INTEREST :</div>
<div class="checkbox col-xs-offset-1" id="chkCoursesList"></div>
</div>
<div class="header ">RECOGNITION OF PRIOR LEARNING/CREDIT TRANSFER:</div>
<div class="control-group">
<label class="control-label">
Have you enrolled in a similar course elsewhere?
</label>
<div class="controls">
<label class="radio-inline">
<input type="radio" name="IsEnrolledSimilarCourseElseWhere" value="true" checked="checked" />Yes</label>
<label class="radio-inline">
<input type="radio" name="IsEnrolledSimilarCourseElseWhere" value="false" />No</label>
</div>
</div>
<div class="control-group">
<label for="Have you been employed in the area covered by the course applied for? " class="control-label">Have you been employed in the area covered by the course applied for? </label>
<div class="controls">
<label class="radio-inline">
<input type="radio" name="IsEmployedInCourseDomain" value="true" checked="checked" />Yes</label>
<label class="radio-inline">
<input type="radio" name="IsEmployedInCourseDomain" value="false" />No</label>
</div>
</div>
<div class="header">PERSONAL DETAILS :</div>
<div class="control-group">
<label for="Title" class="control-label">Title</label>
<div class="controls">
<select class="form-control" id="cmbTitle" name="Title">
</select>
</div>
</div>
<div class="control-group">
<label for="FirstName" class="control-label ">First Name</label>
<div class="contorls ">
<input type="text" class="form-control" id="txtFirstName" name="FirstName" placeholder="Enter first name" />
</div>
</div>
<div class="control-group has-error">
<label for="LastName" class="control-label">Last Name</label>
<div class="contorls ">
<input type="text" class="form-control" id="txtLastName" name="LastName" placeholder="Enter last name" />
</div>
</div>
<div class="control-group">
<label for="OtherName" class="control-label">Other Name</label>
<div class="controls">
<input type="text" class="form-control" id="txtOtherName" name="OtherName" placeholder="Other Name" />
</div>
</div>
<div class="control-group">
<label for="DateOfBirth" class="control-label">Date of Birth</label>
<div class="controls">
<input type="text" class="form-control" id="txtDOB" name="DOB" />
</div>
</div>
<div class="control-group">
<label for="Gender" class="control-label">Gender</label>
<div class="controls">
<select class="form-control" id="cmbGender" name="Gender">
<option value="Male" selected="selected">Male</option>
<option value="Female">Female</option>
</select>
</div>
</div>
<div class="control-group">
<label for="Suburb" class="control-label">Suburb</label>
<div class="controls">
<input type="text" class="form-control" id="txtSuburb" placeholder="Suburb" />
</div>
</div>
<div class="control-group">
<label for="PostCode" class="control-label">Postcode</label>
<div class="controls">
<input type="text" class="form-control" id="txtPostCode" placeholder="Postcode" />
</div>
</div>
</div>
<div class="control-group">
<label for="UsualResidentialAddress" class="control-label">Usual Residential Address</label>
<div class="controls">
<input type="text" class="form-control" id="txtResidentialAddress" placeholder="Usual Residential Address" />
</div>
</div>
<div class="control-group">
<label for="state" class="control-label">State</label>
<div class="controls">
<select class="form-control" id="cmbState" name="State">
</select>
</div>
</div>
<br />
<div class="header">CONTACT DETAILS:</div>
<div class="control-group">
<label for="HomePhone" class="control-label">Home Phone</label>
<div class="controls">
<input type="text" class="form-control" id="txtPhoneNumber" placeholder="Enter home nmber" />
</div>
</div>
<div class="control-group">
<label for="MobleNumber" class="control-label">Mobile</label>
<div class="controls">
<input type="text" class="form-control" id="txtMobile" name="Mobile" placeholder="Enter mobile number" />
</div>
</div>
<div class="control-group">
<label for="EmailAddress" class="control-label">Email</label>
<div class="controls">
<input type="text" class="form-control" id="txtEmail" name="EmailAddress" placeholder="Email" />
</div>
</div>
<div class="control-group">
<label for="PostalAddress" class="control-label">Postal Address</label>
<div class="controls">
<input type="text" class="form-control" id="txtPostalAddress" placeholder="Enter postal address" />
</div>
</div>
<div class="row col-xs-15">
<label for="EmergencyContact" class="control-label">EMERGENCY CONTACT : </label>
</div>
<div class="control-group">
<label for="Emergency Contact Name" class="control-label">Contact Name</label>
<div class="controls">
<input type="text" class="form-control" id="txtEmergencyContactName" placeholder="Enter Emergency Contact Name" />
</div>
</div>
<div class="control-group">
<label for="Emergency Contact Relationship" class="control-label">Relationship</label>
<div class="controls">
<input type="text" class="form-control" id="txtEmergencyRelationship" placeholder="Enter Emergency Contact Relationship" />
</div>
</div>
<div class="control-group">
<label for="Emergency Contact No" class="control-label">Contact No</label>
<div class="controls">
<input type="text" class="form-control" id="txtEmergencyContactNo" placeholder="Enter Emergency Contact Number " />
</div>
</div>
<br />
<div class="header">LANGUAGE AND CULTURAL DIVERSITY:</div>
<div class="table-responsive">
<table class="table">
<tr>
<td>
<label for="Were you born in Australia" class="control-label">Were you born in Australia?</label></td>
<td>
<div class="control-group">
<label class="radio-inline">
<input type="radio" name="IsAustraliaBirthCountry" value="true" onclick="javascript: toggleIsAustraliaBirthCountry();" checked="checked" />Yes</label>
<label class="radio-inline">
<input type="radio" name="IsAustraliaBirthCountry" value="false" onclick="javascript: toggleIsAustraliaBirthCountry();" />No</label>
</div>
</td>
</tr>
<tr>
<td>
<label for="In which country were you born?" class="control-label">In which country were you born?</label>
</td>
<td>
<div class="controls">
<select class="form-control" id="cmbBirthCountry" name="BirthCountries" disabled="disabled">
</select>
</div>
</td>
</tr>
<tr>
<td>
<label for="Do you speak a language OTHER THAN ENGLISH at home" class="control-label">Do you speak a language OTHER THAN ENGLISH at home? </label>
</td>
<td>
<div class="control-group">
<label class="radio-inline control-label">
<input type="radio" name="IsLanguageEnglish" id="rdoOtherlanguageYes" value="true" checked="checked" onclick="javascript: toggleIsLanguageEnglish();" />Yes</label>
<label class="radio-inline control-label">
<input type="radio" name="IsLanguageEnglish" id="rdoOtherLanguageNo" value="false" onclick="javascript: toggleIsLanguageEnglish();" />No</label>
</div>
</td>
</tr>
<tr>
<td>
<label for="LanguageSpoken" class="control-label">Please specify the language spoken</label></td>
<td>
<div class="controls">
<select class="form-control" id="cmbOtherLanguage">
</select>
</div>
</td>
</tr>
<tr>
<td>
<label for="How well do you speak English?" class="control-label">How well do you speak English?</label></td>
<td>
<div class="controls">
<select class="form-control" id="cmbEnglishLevel">
</select>
</div>
</td>
</tr>
<tr>
<td>
<label for="Are you of Aboriginal Origin" class="control-label">Are you of Aboriginal Origin Or Are you of Torres Strait Islander Origin ?</label></td>
<td>
<div class="control-group">
<label class="radio-inline">
<input type="radio" name="IsAboriginalOrigin" id="AboriginalOriginYes" value="true" checked="checked" onclick="javascript: toggleIsAboriginal();" />Yes</label>
<label class="radio-inline">
<input type="radio" name="IsAboriginalOrigin" id="AboriginalOriginNo" value="false" onclick="javascript: toggleIsAboriginal();" />No</label>
</div>
</td>
</tr>
<tr>
<td></td>
<td>
<div class="checkbox" id="chkAboriginalOrigin">
</div>
</td>
</tr>
<tr>
<td colspan="2">
<div class="header">DISABILITY:</div>
</td>
</tr>
<tr>
<td>
<label for="Do you consider yourself to have a disability">Do you consider yourself to have a disability, impairment or long-term condition?</label>
</td>
<td>
<div class="control-group">
<label class="radio-inline">
<input type="radio" name="IsDisability" id="IsDisabilityYes" value="true" checked="checked" onclick="javascript: toggleIsDisability();" />Yes</label>
<label class="radio-inline">
<input type="radio" name="IsDisability" id="IsDisabilityNo" value="false" onclick="javascript: toggleIsDisability();" />No</label>
</div>
</td>
</tr>
<tr>
<td>
<label for="" class="control-label">If YES, then please indicate what kind of disability:</label></td>
<td>
<div class="checkbox" id="chkDisabilities">
</div>
</td>
</tr>
<tr>
<td colspan="2">
<div class="header">SCHOOLING</div>
</td>
</tr>
<tr>
<td>
<label for="What is your highest COMPLETED school level?" class="control-label">What is your highest COMPLETED school level? (Tick one box)</label></td>
<td>
<div class="controls">
<select class="form-control" id="cmbSchoolLevel">
</select>
</div>
</td>
</tr>
<tr>
<td>
<label for="">Are you still attending secondary school?</label></td>
<td>
<div class="control-groups">
<label class="radio-inline">
<input type="radio" name="IsAttendingSecondarySchool" id="rdoIsAttendingSecondarySchoolYes" value="true" checked="checked" />Yes</label>
<label class="radio-inline">
<input type="radio" name="IsAttendingSecondarySchool" id="rdoIsAttendingSecondarySchoolNo" value="false" />
No</label>
</div>
</td>
</tr>
<tr>
<td>
<label for="" class="control-label">In which YEAR did you complete this school level? </label>
</td>
<td>
<div class="controls">
<select class="form-control" id="cmbCompletedYear" name="YearsList">
</select>
</div>
</td>
</tr>
<tr>
<td colspan="2">
<div class="header">PREVIOUS QUALIFICATIONS ACHIEVED</div>
</td>
</tr>
<tr>
<td>
<label for="">Have you successfully completed any of the following qualifications in Australia? </label>
</td>
<td>
<div class="control-group">
<label class="radio-inline">
<input type="radio" name="IsAustralianQualified" value="true" id="IsAustralianQualifiedYes" checked="checked" onclick="javascript: toggleAustralianQualified();" />Yes</label>
<label class="radio-inline">
<input type="radio" name="IsAustralianQualified" value="false" id="IsAustralianQualifiedNo" onclick="javascript: toggleAustralianQualified();" />No</label>
</div>
</td>
</tr>
<tr>
<td></td>
<td>
<div class="checkbox" id="chkPriorQulifications">
</div>
</td>
</tr>
<tr>
<td>
<label for="">Current Employment Status </label>
</td>
<td>
<select class="form-control" id="cmbEmploymentStatus">
</select>
</td>
</tr>
<tr>
<td>
<label for="">Your Study Reason</label></td>
<td>
<select class="form-control" id="cmbStudyReason">
</select>
</td>
</tr>
</table>
</div>
<div class="right">
<a href="#" class="btn btn-info btn-lg" id="btnSubmit">Submit</a>
<a href="#" class="btn btn-info btn-lg" id="btnCancle">Cancle</a>
</div>
</div>
</form>
Here Script.js File
此js文件添加在母版页头
$(document).ready(function () {
$('#Student_portal').validate({
rules: {
FirstName: {
minlength: 10,
required: true
},
LastName: {
minlength: 10,
required: true
},
},
highlight: function (element) {
$(element).closest('.control-group').removeClass('has-success').addClass('has-error');
},
success: function (element) {
$(element).closest('.control-group').removeClass('has-error').addClass('has-success');
}
});
});
如何实现bootstrap验证器验证。请告诉我。我试图找出问题，但毫无价值。
答案 0 :(得分：0)
您必须在表单提交上调用bootstrap 有效方法。您可以在表单上设置 onsubmit 属性并将其设置为您的验证方法..类似这样的
<form id="Student_portal" onsubmit="return $('#Student_portal').valid()">