Моя проверка Bootstrap отлично работает в элементе управления формой, см. Изображение ниже
Мой код:
<form role="form" data-toggle="validator" id="myform">
<div class="form-group">
<div class="row">
<div class="col-md-3">
<div class="form-group">
<select class="selectpicker" data-live-search="true" title="Select Teacher" id="ddlMultiTeacher" style="background-color: white" required>
<%--<option value="">None</option>--%>
</select>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<select class="selectpicker" data-live-search="true" title="Select Subject" id="ddlMultiSubject" style="background-color: white" required>
</select>
</div>
</div>
</div>
<br />
<div class="row">
<div class="col-md-3">
<div class="form-group">
<select class="selectpicker" data-live-search="true" title="Select Class" id="ddlMultiClass" style="background-color: white" required>
</select>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<select class="selectpicker" data-live-search="true" title="Select Section" id="ddlMultiSection" style="background-color: white" required>
</select>
</div>
</div>
</div>
<br />
<div class="row">
<div class="col-md-2">
<%-- <button id="btnSubmit2" class="btn btn-primary btn-block">Save</button>--%>
<input id="btnGenerateSchedule" class="btn btn-primary btn-block" type="submit" value="Save" />
</div>
</div>
</div>
</form>
Но всякий раз, когда я использую свой код для отправки кнопок через jquery, моя проверка перестает работать.
$('#btnGenerateSchedule').click(function (e) {
debugger;
e.preventDefault();
bootbox.confirm("<b>Are you sure?</b>", function (result) {
if (result) {
GenerateSchedule();
//bootbox.alert({
// title: "Alert",
// message: "Your Schedule Has Been Generated !"
//})
} else {
//console.log("User declined dialog");
}
});
})
Кто-нибудь может сказать мне, что я делаю не так? мне не хватает плагинов?
2 ответа
Когда вы пишете jquery submit или click event, тогда проверка bootstrap или html не работает. Если вы хотите, чтобы проверка html / bootstrap работала до события jquery click / submit, сделайте следующее:
$('#btnGenerateSchedule').click(function (e) {
if($("form")[0].checkValidity()){
debugger;
e.preventDefault();
bootbox.confirm("<b>Are you sure?</b>", function (result) {
if (result) {
GenerateSchedule();
} else {
//console.log("User declined dialog");
}
});
} });
$ ("form") [0]) зависит от формы на странице. Если это первая форма на вашей странице, то форма [0], если это вторая форма на вашей странице, то $ ("form") 1) и так далее.
Для получения дополнительных сведений перейдите по ссылке: проверка HTML и jquery вместе
Попробуй это,
$('form').on('click','#btnGenerateSchedule',function (e) {
debugger;
e.preventDefault();
bootbox.confirm("<b>Are you sure?</b>", function (result) {
if (result) {
GenerateSchedule();
//bootbox.alert({
// title: "Alert",
// message: "Your Schedule Has Been Generated !"
//})
} else {
//console.log("User declined dialog");
}
});
})
En Español