簡體   English   中英

取消時取消引導程序模式更改

[英]Dismiss bootstrap modal changes on cancel

我有一個引導模式,它的內部具有屬性contenteditable = true的表(表是使用js動態創建的)。 我想設置一個整潔的功能-如果用戶按“取消”,則表中的更改將被忽略。 我知道我可以通過為不同狀態編寫一個函數然后在取消的情況下調出前一個狀態來做到這一點。 我只是想知道有沒有更快更好的方法?

我進行了一些搜索,發現一個存在類似問題的鏈接 ,但是方法和結果與我的有所不同,這意味着它對我不起作用。

這是我的代碼-部分代碼使用愛沙尼亞語,我認為對於該問題,通用代碼不是必需的,但我仍然會提供:

    <div class="modal fade" id="ajamasinModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel"><i class="fa fa-cog" style="font-size:20px"></i> Ajamasin</h4>
                </div>
                <div class="modal-body">
                    <div id="changeablevoor"></div>
                    <button type="button" class="btn btn-primary" onClick="muudaClick()">Change</button>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
                    <button type="button" class="btn btn-success" data-dismiss="modal">Save</button>
                </div>
            </div>
        </div>
    </div> 

嘗試以下方法(查看內聯注釋):

HTML

<div class="modal fade" id="ajamasinModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
     <div class="modal-dialog">
          <div class="modal-content">
               //...
               <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
                    <button type="button" class="btn btn-success" data-dismiss="modal">Save</button>
               </div>
          </div>
      </div>
 </div> 

JS

// Add hidden event of the modal 
$('#ajamasinModal').on('hidden.bs.modal', function (e) {
    cancelModal(); // Call the function to cancel the modal after hiding of the modal
})

// Cancel the modal
function cancelModal() {
   // Re-generate content with default values
}

有關Bootstrap Modal事件的更多信息,請參見Bootstrap文檔: Bootstrap Modal事件。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM