我正在使用Bootstrap验证验证我的表单。 验证工作正常，但是当我重置表单时，表示错误的字段没有重置，即;如果某个字段显示有红色边框表示的错误，则字段中的文本会在重置时删除，但不会删除边框。
我的HTML代码
<body>
<br />
<h2 class="text-muted">                Enter Provider Details:</h2>
<div class="container">
<form name="Provider" class="form-horizontal" data-toggle="validator" id="ProviderForm" method="post">
<div class=" form-group">
<label for="Provider" class="control-label col-sm-2">PROVIDER :</label>
<div class="col-sm-8">
<div class="input-group">
<input type="text" maxlength="20" id="Providertype" data-bind="value: ProviderType" class="form-control" placeholder="Choose a Provider" readonly="true" required tabindex="1" autofocus />
<div class="input-group-btn">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
</button>
<ul id="demolist" class="dropdown-menu">
<li><a href="#">Doctor</a></li>
<li class="disabled"><a href="#">Facilities</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class=" form-group">
<label for="firstName" class="col-sm-2 control-label">First Name</label>
<div class="col-sm-8">
<input type="text" maxlength="50" title="testfirstname" class="form-control" id="inputFirstName" pattern ="^[a-zA-Z]+$" data-bind="value: FirstName" data-error="Only alphabets are allowed" placeholder="Enter the First Name" required tabindex="2"/>
</div>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label for="lastName" class="col-sm-2 control-label">Last Name</label>
<div class="col-sm-8">
<input type="text" maxlength="50" title="testlastname" class="form-control" id="inputLastName" pattern ="^[a-zA-Z]+$" data-bind="value: Lastname" data-error="Only alphabets are allowed" placeholder="Enter the Last Name" required tabindex="3"/>
</div>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label for="Certification" class="control-label col-sm-2">Certification :</label>
<div class="col-sm-8">
<div class="input-group">
<input type="text" maxlength="20" id="certification" data-bind="value: Certification" class="form-control" placeholder="Choose a Certification" readonly="true" required tabindex="4" />
<div class="input-group-btn">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
</button>
<ul id="demolist2" class="dropdown-menu">
<li><a href="#">M.D.</a></li>
<li class="disabled"><a href="#">D.O.</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="form-group">
<label for="Specialization" class="control-label col-sm-2">Specialization :</label>
<div class="col-sm-8">
<div class="input-group">
<input type="text" maxlength="50" id="specialization" data-bind="value: Specialization" class="form-control" placeholder="Choose a Specialization" readonly="true" required tabindex="5" />
<div class="input-group-btn">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
</button>
<ul id="demolist3" class="dropdown-menu">
<li><a href="#">Family Practitioner</a></li>
<li class="disabled"><a href="#">Dentist</a></li>
<li class="disabled"><a href="#">Emergency Doctor</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="form-group">
<label for="SSN" class="col-sm-2 control-label">SSN</label>
<div class="col-sm-8">
<input type="tel" title="SSN" maxlength="9" class="form-control" id="inputSSN" data-bind="value: SSN" pattern ="^\(?([0-9]{3})[-]?([0-9]{2})[-]?([0-9]{4})$" placeholder="Enter SSN" required tabindex="6"/>
</div>
</div>
<div class="form-group">
<label for="FacilityName" class="col-sm-2 control-label">Facility Name</label>
<div class="col-sm-8">
<input type="text" maxlength="50" class="form-control" id="inputFacility" data-bind="value: FacilityName" placeholder="Enter your Facility" required tabindex="7"/>
</div>
</div>
<div class="form-group">
<label for="ContactNumber" class="col-sm-2 control-label">Contact Number</label>
<div class="col-sm-8">
<input type="text" maxlength="10" class="form-control" id="inputContactNum" data-bind="value: ContactNumber" placeholder="Enter your Contact Number" required tabindex="8">
</div>
</div>
<div class="form-group">
<label for="EmailID" class="col-sm-2 control-label">Email ID</label>
<div class="col-sm-8">
<input type="email" maxlength="50" class="form-control" id="inputEmail" data-bind="value: ContactEmail" placeholder="Enter your Email ID" required tabindex="9"/>
</div>
</div>
<div class="form-actions span7 text-center">
<button type="submit" id="Submit" class="btn btn-primary btn-md ">Save</button>
<button type="reset" onclick="myFunction()" class="btn btn-primary btn-md ">Reset</button>
</div>
<br />
@*<div class="message">PROVIDER WAS ADDED SUCCESSFULLY</div>*@
@if (TempData["Message"] != null)
{
<center id="para">
@TempData["Message"]
</center>
}
</form>
</div>
</body>
我已经包含以下JS文件
请指引我朝正确的方向前进。