1、在aspx中添加,将依赖添加进来
<link rel="stylesheet" href="Content/bootstrap.min.css" /><script src="Scripts/jquery-3.7.0.min.js"></script><script src="Scripts/bootstrap.min.js"></script>
2、添加模态对话框的div
<!-- 添加对话框 -->
<div class="modal fade" id="AddModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"><div class="modal-dialog"><div class="modal-content"><div class="modal-header"><h5 class="modal-title" id="AddModalLabel">Modal title</h5><button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body">...</div><div class="modal-footer"><button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button><button type="button" class="btn btn-primary">Save changes</button></div></div></div>
</div>
3、我封装了两个C#函数来显示和隐藏bootstrp的对话框
public void showModal(string id)
{string script = "var myModal = new bootstrap.Modal(document.getElementById('" +id +"'), {\r\n keyboard: false\r\n});" +"myModal.show()";ClientScript.RegisterStartupScript(this.GetType(), "alert", script, true);
}public void hideModal(string id)
{string script = "var myModal = new bootstrap.Modal(document.getElementById('" +id +"'), {\r\n keyboard: false\r\n});" +"myModal.hide()";ClientScript.RegisterStartupScript(this.GetType(), "alert", script, true);
}
这样调用
protected void BtnAdd_Click(object sender, EventArgs e)
{// 弹框获取信息showModal("AddModal");
}
至于获取数据其他的就要交给你去将aspx中的对话框部分,稍作修改,将button改成asp:Button这样来获取数据,加油!!!