我正在使用引导选项卡 n 创建一个嵌套选项卡，我如何使用引导验证来验证控件，因为它甚至无法在非嵌套选项卡中工作：
<div class="tabbable">
<!-- Only required for left/right tabs -->
<ul class="nav nav-tabs">
<li class="active"><a href="#PersonelInfo" data-toggle="tab">Personel</a></li>
<li><a href="#CompanyInfo" data-toggle="tab">Company</a></li>
<li><a href="#AcademicsInfo" data-toggle="tab">Academics</a></li>
<li><a href="#WorkExperienceInfo" data-toggle="tab">Work Experience</a></li>
</ul>
<div class="tab-content" style="border:thin #DDDDDD solid">
<div class="tab-pane fade in active" id="PersonelInfo">
<!-- Start Of side Tabs for Personel -->
<div class="tabbable tabs-left">
<br />
<ul id="subtabs" class="nav nav-tabs">
<li class="active"><a class="tchild" id ="A1" href="#BasicInfo" data-toggle="tab">Basic</a></li>
<li><a class="tchild" id="A2" href="#ContactInfo" data-toggle="tab">Contact</a></li>
<li><a class="tchild" id ="A5" href="#DependentsInfo " data-toggle="tab">Dependents</a></li>
<li><a class="tchild" id ="A4" href="#DisplayInfo " data-toggle="tab">Display</a></li>
<li><a class="tchild" id ="A3" href="#LoginInfo " data-toggle="tab">Login</a></li>
</ul>
<div id="subtabcontent" class="tab-content">
<div class="tab-pane fade in active" id="BasicInfo">
<%-- <br />
<span class="theadgs">Personel Details</span>
<br />--%>
<br />
<div class="controls-row">
<div class="control-group span3">
<label class="control-label">First Name <span class="late">*</span></label>
<div class="controls">
<input type="text" id="txtFirstName" name ="FirstName" class="input-large" data-column="FirstName" />
</div>
</div>
<div class="control-group span3">
<label class="control-label">Last Name <span class="late">*</span></label>
<div class="controls">
<input type="text" id="txtLastName" name ="LastName" class="input-large" data-column="LastName" />
</div>
</div>
<div class="control-group span3">
<label class="control-label">Middle Name <span class="late">*</span></label>
<div class="controls">
<input type="text" id="Text1" name ="MiddleName" class="input-large" data-column="MiddleName" />
</div>
</div>
</div>
<div class="controls-row">
<div class="control-group span3">
<label class="control-label">Father Name <span class="late">*</span></label>
<div class="controls">
<input type="text" id="txtFatherName" name ="FatherName" class="input-large" data-column="FatherName" />
</div>
</div>
<div class="control-group span3">
<label class="control-label">Religion</label>
<div class="controls">
<input type="text" id="txtReligion" name ="Religion" class="input-large" data-column="Religion" />
</div>
</div>
<div class="control-group span3">
<label class="control-label">CNIC</label>
<div class="controls">
<input type="text" id="txtCNIC" name ="CNIC" class="input-large" data-column="CNIC" />
</div>
</div>
</div>
<div class="controls-row">
<div class="control-group span3">
<label class="control-label">Date Of Birth</label>
<div class="controls">
<div class="input-append date datepicker datepicker-basic" data-date="<%= today.ToString("MM/dd/yyyy") %>" data-date-format="mm-dd-yyyy">
<input id="dtDateOfBirth" name ="DateOfBirth" data-column="DateOfBirth" size="12" type="text" value="12-02-2012"/><span class="add-on"><i class="icon-calendar"></i></span>
</div>
</div>
</div>
<div class="control-group span3">
<label class="control-label">Marital Status</label>
<div class="controls">
<select id="ddlMaritalStatus" tabindex="1" data-placeholder="Select here.." class="span4" name="MaritalStatus" data-column="MaritalStatus">
</select>
<%--<asp:DropDownList ID="ddlMaritalStatus" runat="server" data-placeholder="Select here.." class="input-large" data-column="MaritalStatus" name="MaritalStatus" ClientIDMode="Static">
</asp:DropDownList>--%>
</div>
</div>
<div class="control-group span3">
<label class="control-label">Gender</label>
<div class="controls">
<label class="radio inline"><input type="radio" name="optionsRadios" id="rbtnMale" value="Gender" class="radiocheck" checked="checked"/>Male</label>
<label class="radio inline"><input type="radio" name="optionsRadios" id="rbtFemale" value="Gender" class="radiocheck"/>Female</label>
</div>
</div>
</div>
<div class="controls-row">
<div class="control-group span3">
<label class="control-label">Blood Group</label>
<div class="controls">
<input type="text" id="txtBloodGroup" name ="BloodGroup" class="input-large" data-column="BloodGroup" />
</div>
</div>
<div class="control-group span3">
<label class="control-label">Language</label>
<div class="controls">
<input type="text" id="txtLanduage" name ="FatherName" class="input-large" data-column="FatherName" />
</div>
</div>
</div>
<div class="controls-row">
<div class="control-group span3">
<label class="control-label">Skills</label>
<div class="controls">
<textarea id="txtSkills" class="input-xlarge" style="" rows="5" data-column="Skills" name="Skills"></textarea>
</div>
</div>
</div>
</div> </div>
</div>
</div>
验证码 / ------------ 表单验证------------ /
$('#form1').validate({
errorClass: "help-inline",
errorElement: "span",
rules: {
PortalName: {
required: true,
},
PortalDesc: {
required: true
}
},
messages: {
PortalName: {
required: "Specify Name for portal"
},
PortalDesc: {
required: "test validation"
}
},
highlight: function (label) {
$(label).closest('.control-group').addClass('error').removeClass('success');
},
success: function (label) {
$(label).text('').closest('.control-group').addClass('success');
}
});
});