在我的 HTML 和 JavaScript 代码中,除了提交按钮之外,所有东西都运行良好,如果任何表单字段中都没有错误,它应该提交页面,但它没有提交。
<div class="container">
<div class="panel panel-default">
<div class="panel-heading">Registration</div>
<div class="panel-body">
<form id="registration-form" method="post" class="form-horizontal">
<div class="form-group">
<label class="col-md-2 control-label" for="fName">First Name</label>
<div class="col-md-4">
<input type="text" class="form-control" id="fName" name="fName" placeholder="First Name"/>
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label" for="lName">Last Name</label>
<div class="col-md-4">
<input type="text" class="form-control" id="lName" name="lName" placeholder="Last Name"/>
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label" for="email">E-mail ID</label>
<div class="col-md-4">
<input type="text" class="form-control" id="email" name="email" placeholder="Your E-mail address"/>
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label" for="password">Password</label>
<div class="col-md-4">
<input type="password" class="form-control" id="password" name="password" placeholder="Password"/>
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label" for="confirmPasword">Confirm Password</label>
<div class="col-md-4">
<input type="password" class="form-control" id="confirmPasword" name="confirmPasword" placeholder="Confirm Password"/>
</div>
</div>
<div class="form-group">
<div class="col-md-6 col-xs-offset-2 ">
<button type="submit" class="btn btn-success" name="submit" >Submit</button>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"> </script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrapValidator.min.js" type="text/javascript"> </script>
</body>
<script type="text/javascript">
$(document).ready(function(){
$('#alwaysEnableButtonForm')
var validator = $("#registration-form").bootstrapValidator({
feedbackIcons:{
valid:"glyphicon glyphicon-ok",
invalid:"glyphicon glyphicon-remove",
validating:"glyphicon glyphicon-refresh"
},
fields:{
fName:{
message:"First Name is required",
validators:{
notEmpty:{
message:"Please provide the First Name"
},
stringLength:{
max : 25,
message: "The first Name should not be more than 25 characters long"
}
}
},
lName:{
message:"Last Name is required",
validators:{
notEmpty:{
message:"Please provide the Last Name"
},
stringLength:{
max : 25,
message: "The Last Name should not be more than 25 characters long"
}
}
},
email:{
message:"E-mail address is required",
validators:{
notEmpty:{
message:"Please an E-mail address"
},
stringLength:{
min:6,
max:45,
message: "E-mail address must be between 6 and 45 characters long"
},
emailAddress:{
message:"E-mail address is invalid"
}
}
},
password:{
validators:{
notEmpty:{
message:"Password is required"
},
stringLength:{
min:8,
message:"Password must be 8 digits long atleast"
},
different:{
field:"email",
message:"E-mail address and password can not match"
}
}
},
confirmPasword:{
validators:{
notEmpty:{
message:"This field is required"
},
identical:{
field:"password",
message:"This should must match the first password"
}
}
}
}
})
.on('success.fields.fv', function(e, data) {
if (data.fv.getInvalidFields().length > 0) { // There is invalid field
data.fv.disableSubmitButtons(true);
}
});
});
</script>