在ASP.Net中使用JQuery的模式確認框

Question

我希望在ASP.Net Gridview中具有“確認刪除”選項的類似行為，因為此問題顯示了如何在ASP.Net Gridview 中添加“確認刪除”選項？ 但是使用Jquery確認框。

我在回發行為和asp.net頁面流方面遇到很多問題。

我想做一些簡單的事情：

<asp:Button ID="ButtonRemove" runat="server" Text="<%$ Resources:Localizacao, BUTTON_REMOVE %>" OnClick="ButtonRemove_Click" OnClientClick="displayConfirmDialog();/>

一些想法，我如何可以觸發javascript中的OnClick事件，或者如何將面板作為確認對話框？

*今天我使用了ajaxcontroltoolkit，但是由於已經停產，所以我試圖找出一些更優雅的選擇。

Answer 1

1-具有一個將作為對話框的隱藏div。 將其放在您的HTML底部，主頁標記之外。

<div id="dialog1" class="dialog" style="display:none">
   SOME TEXT
   <a href="javascript://" onclick="confirmDialog()">CONFIRM</a>
</div>

樣式如下：

.dialog {
   position:absolute;
   width:250px;
   height:250px;
   background-color:#ffffff
}

.dialog a {
    display:block;
    padding:5px;
    margin-top:50px;
    background-color:#c0c0c0
}

2-在顯示對話框之前將其居中：

centerMe('#dialog1')

function centerMe(element) {
    //pass element name to be centered on screen
    var pWidth = jQuery(window).width();
    var pTop = jQuery(window).scrollTop()
    var eWidth = jQuery(element).width()
    var height = jQuery(element).height()
    jQuery(element).css('top', pTop + 100 + 'px')
    jQuery(element).css('left', parseInt((pWidth / 2) - (eWidth / 2)) + 'px')
}

3-顯示對話框：

jQuery('#dialog1').fadeIn('slow')

4-創建一個函數來處理CONFIRM按鈕：

function confirmDialog() {
    jQuery('#dialog1').hide()
    ... your code ...
}

如果想花哨的話，可以為對話框創建背景圖像，而不是簡單的白色背景。