Jquery BlockUI w / Asp.net确认删除

时间:2009-09-05 05:00:09

标签: asp.net jquery

Asp.Net 3.5 / WebForms(没有ajax)

我正在尝试使用jquery&更新删除确认框。 UIBlock。旧代码看起来像这样......

<asp:LinkButton OnClientClick="return confirm('Are you sure you want to delete?')" runat="server" ID="DeleteButton" OnClick="DeleteButton_OnClick">Delete</asp:LinkButton>

使用jquery&amp; amp延迟推迟然后继续回发的最佳做法是什么? asp.net?我还没有找到一个干净的方式/示例/指导。 Dave Ward(encosia.com)有一些带UIBlock的例子,但没有一个使用UIBlock作为确认/模态弹出窗口。

感谢您提供任何帮助/指示。

答案

<a href="#" id="delete">
  <span>Delete?</span>
</a>

<div id="question" style="display:none; cursor: default"> 
        <h1>Are you sure you want to delete?</h1> 
        <asp:LinkButton runat="server" Text="Yes" OnClick="DeleteButton_OnClick"></asp:LinkButton>
        <a href="#" id="no"><span>No</span></a>
</div> 


<script type="text/javascript">
    $(document).ready(function() {

      $('#delete').click(function(ev) {
        ev.preventDefault();
        $.blockUI({ message: $('#question'), css: { width: '275px'} });
      });

      $('#no').click(function() {
        $.unblockUI();
        return false;
      });

    }); 
</script> 

1 个答案:

答案 0 :(得分:2)

您可以这样做:

$('#DeleteButton').bind('click', function() {

   // if confirmation button inside the form is pressed ..
   $('#confirm_button').bind('click', function() {
    // redirect to the page where it resolves the request       
        window.location = "http://www.site.com/?delete";
        // or use ajax call
    $.ajax({
        // the request to delete 
    });
        // this one in case you choose to make ajax request
    $.unblockUI();
   });

   $.blockUI({
        // form setted with display:none; in css to be trigged when delete button is clicked
        // css here is an example
    message: $('#delete_form'),
    css: { 
        border: 'none', 
        padding: '15px',
        width: '400px',
        backgroundColor: '#000', 
        '-webkit-border-radius': '10px', 
        '-moz-border-radius': '10px',
        color: '#fff' 
        }
    });

        // cancel button inside the form, when clicked, dismiss form 
    $('#cancel').click($.unblockUI);
        // if user clicks outside the form, it dismisses the form as well
    $('.blockOverlay').click($.unblockUI); 
});