twitter-bootstrap 如何在关闭时将引导模式重置为其原始内容？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/34625744/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to reset bootstrap modal to its original contents on close?
提问by treblaluch
P.S I am not very good in javascript and I know this question has been asked but the solutions does not apply to my problem so I will ask this question again.
PS我不太擅长javascript，我知道有人问过这个问题，但解决方案不适用于我的问题，所以我会再次问这个问题。
I'm stuck with this problem and haven't find the solution yet. I wanted to clear all the things that happened into my modal after its close.
我被这个问题困住了，还没有找到解决方案。我想清除我的模态关闭后发生的所有事情。
My modal is a form modal, so whenever I click submit, codeigniter validation messages will show by the use of ajax on <div style="font-size:10px;width:50%;" id="info"></div>. Now whenever I close the modal, the validation messages stays when I re-open it. What should be done in order to clear those out after closing the modal?
我的模态是一个表单模态，所以每当我点击提交时，codeigniter 验证消息将通过使用 ajax on 显示<div style="font-size:10px;width:50%;" id="info"></div>。现在，每当我关闭模态时，验证消息都会在我重新打开时保留。关闭模态后应该怎么做才能清除它们？
This is the function called by the ajax:
这是ajax调用的函数：
public function addcomp () {
$this->load->library('form_validation');
$this->load->helper('security');
$this->form_validation->set_rules('comp_name','Computer Name','trim|required|callback_pc_exist');
$this->form_validation->set_rules('status','Status','trim|required');
$this->form_validation->set_rules('location','Location','trim|required');
if ($this->form_validation->run()) {
$this->load->model('asset_model');
$result=$this->asset_model->addpc();
if (!$result) {
echo mysqli_error($result);
} else {
echo "<div class='alert alert-success alert-dismissable'>
<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×</button>
Computer Successfully Added!</div>";
}
}
echo validation_errors("<div class='alert alert-danger alert-dismissable'><button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×</button>","</div>");
}
This is the ajax called by submission:
这是提交调用的ajax：
$(document).ready(function(){
$("#addpc").submit(function(){
var formdata=$("#addpc").serialize();
$.ajax({
url:"asset_management/addcomp",
type:"POST",
data: formdata,
async: true,
}).done(function( formdata ) {
$('#info').html(formdata);
$("#addpc")[0].reset();
viewdata();
});
return false;
});
});
回答by Praveen Kumar Purushothaman
You can make use of the Bootstrap's Modal Events. You should be concerned about these two:
您可以使用Bootstrap 的 Modal Events。你应该关心这两个：
hide.bs.modalThis event is fired immediately when the hide instance method has been called.hidden.bs.modalThis event is fired when the modal has finished being hidden from the user (will wait for CSS transitions to complete).
hide.bs.modal当调用隐藏实例方法时，立即触发此事件。hidden.bs.modal当模态完成对用户隐藏时会触发此事件（将等待 CSS 转换完成）。
So, you can do this:
所以，你可以这样做：
$(function () {
// Delegating to `document` just in case.
$(document).on("hidden.bs.modal", "#myModalID", function () {
$(this).find("#info").html(""); // Just clear the contents.
$(this).find("#info").remove(); // Remove from DOM.
});
});
Update
更新
Seeing your code, you might need to use this:
看到你的代码，你可能需要使用这个：
$(function () {
// Delegating to `document` just in case.
$(document).on("hidden.bs.modal", "#myModalID", function () {
$(this).find(".alert-danger").remove(); // Remove from DOM.
});
});
