gpt4 book ai didi

javascript - 表单提交不等待甜蜜警报确认

转载 作者:行者123 更新时间:2023-11-30 11:30:59 25 4
gpt4 key购买 nike

我有 CRUD,想添加带有 Sweet Alert 的确认框。但我只是将它添加到 Create Form 中。显然很简单,我只是想这样:

  • 输入数据
  • 点击提交按钮
  • Sweet Alert 确认出现
  • 点击"is"
  • 数据存储到数据库
  • 返回阅读表

这是我的代码:

<!-- Form -->
<form role="form" method="post" class="form-horizontal" id="tmbhunit" action="<?= base_url() ?>C_unit/create">
<!-- Card Icon -->
<div class="card-header card-header-icon" data-background-color="red">
<i class="material-icons">account_balance</i>
</div>
<!-- End Card Icon -->

<!-- Card Content -->
<div class="card-content">
<!-- Card Title -->
<h4 class="card-title">Tambah Data</h4>
<!-- End Card Title -->
<hr>

<!-- Label Input -->
<div class="row">
<label class="col-sm-2 label-on-left" for="namaunit">Nama Unit</label>
<div class="col-sm-4">
<div class="form-group label-floating is-empty">
<label class="control-label"></label>
<input type="text" class="form-control" id="namaunit" name="nm_unit" required placeholder="Masukan nama unit..">
</div>
</div>
</div>
<!-- End Label Input -->
<!-- Label Input -->
<div class="row">
<label class="col-sm-2 label-on-left" for="almtunit">Alamat Unit</label>
<div class="col-sm-4">
<div class="form-group label-floating is-empty">
<label class="control-label"></label>
<input type="text" class="form-control" id="almtunit" name="alamat" required placeholder="Masukan alamat unit..">
<br>
<input type="submit" name="submit" id="btn-submit" class="btn btn-primary btn-fill" value="Tambah" />
<input type="button" name="cancel" class="btn btn-warning btn-fill" value="Cancel" onclick="history.back()" />
</div>
</div>
</div>
<!-- End Label Input -->

</div>
<!-- End Card Content -->
</form>
<!-- End Form -->

这是javascript:

$("#tmbhunit").submit( function () {

var nm_unit = $("#namaunit").val();
var almtunit = $("#almtunit").val();

swal({
title: "Are you sure?",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Yes!",
cancelButtonText: "Cancel",
closeOnConfirm: true
}, function(isConfirm){
if (isConfirm) {
event.preventDefault();
return true;
} else {
return false;
}
});

});

其实脚本是可以运行的,sweet alert也出现了,但是表格提前提交了,没有给我确认的机会,我试过所有的导师,但一次都没有成功。

最佳答案

在提交前使用而不是像下面的提交函数

 jQuery("body").on("beforeSubmit", "form#tmbhunit", function() {
// You logic
return false;
});

关于javascript - 表单提交不等待甜蜜警报确认,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46234812/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com