在我的应用中,我希望在提交表单时显示模式或弹出窗口10到15秒,然后导航到另一个页面。
<td colspan=3><button class="btn btn-success btn-lg btn-block" id="submit" type="submit">ADD TOPIC</button></td>
模式:
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="memberModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="memberModalLabel">Edit Member Detail</h4>
</div>
<div class="modal-body">
<p>Success</p>
</div>
</div>
</div>
</div>
Ajax:
<script>
$(document).ready(function(){
$('#submit').click(function(){
var txttopicname = $('#txttopicname').val();
var boardid = $('#boardid').val();
var bclassid = $('#bclassid').val();
var subjectid = $('#subjectid').val();
if(txttopicname == '' )
{
$('#error_message').html("All Fields are required");
}
else{
$('#error_message').html('');
$.ajax({
url: "topicadddb.php",
method: "POST",
data: {txttopicname:txttopicname, boardid:boardid, bclassid:bclassid, subjectid:subjectid},
success:function(data){
$('#myModal').modal('show').html(data);
setTimeout(function(){
$('#myModal').modal('hide');
},10000);
window.location="topiclistdb.php"; //navigate
}
});
}
});
});
</script>
topicadddb.php:
<?php
if (isset($_POST['txttopicname'])) {
$topicname = $_POST['txttopicname'];
$boardid = $_POST['boardid'];
$bclassid = $_POST['bclassid'];
$subjectid = $_POST['subjectid'];
$s="INSERT INTO topicinfo (topicname,boardid,bclassid,subjectid,status) VALUES ( UPPER('$topicname'),'$boardid','$bclassid','$subjectid',0)";
//echo $s;
mysqli_query($conn,$s) or die( mysqli_error());
header('Location:topiclistdb.php');
}
?>
当我单击“提交”按钮时,它会淡出1秒钟,然后直接转到下一页。