2010-07-20 47 views
2

我已经实现了使用这些网页上描述的技术的“未保存的更改”警告:的DropDownList没有触发onb​​eforeunload时的AutoPostBack =“真”

Client/JS Framework for "Unsaved Data" Protection?

http://kenbrowning.blogspot.com/2009/01/using-jquery-to-standardize.html

这工作得很好,除了一个DropDownList在页面上。它做了一个AutoPostBack,并且我想让onbeforeunload启动,因为未保存的更改将会丢失,但它不起作用。是否应该提高onbeforeunload事件?我能以某种方式让它提高事件吗?

编辑: DropDownList控件是一个UpdatePanel内,因此,这意味着它不卸载页面,这将是为什么onbeforeunload不被触发。有什么办法可以通过编程方式触发事件吗?或者我必须推出自己的模仿确认对话框?

编辑2 我现在有一个解决方案,将对话框添加到来自UpdatePanel的异步回发。我编辑了原始脚本,并按照我的解决方案中所述添加了对setConfirmAsyncPostBack()的调用。

这里是我的javascript:

/****Scripts to warn user of unsaved changes****/ 

//https://stackoverflow.com/questions/140460 
//http://jonstjohn.com/node/23 

//Activates the confirm message onbeforeunload. 
function setConfirmUnload(on) { 

    setConfirmAsyncPostBack(); 

    if (on) { 
     removeCheckFromNoWarnClasses(); 
     fixIEonBeforeUnload(); 
     window.onbeforeunload = unloadMessage 
     return; 
    } 

    window.onbeforeunload = null 
} 

function unloadMessage() { 

    return 'You have unsaved changes.'; 
} 

//Moves javascript from href to onclick to prevent IE raising onbeforeunload unecessarily 
//http://kenbrowning.blogspot.com/2009/01/using-jquery-to-standardize.html 
function fixIEonBeforeUnload() { 

    if (!$.browser.msie) 
     return; 
    $('a').filter(function() { 
     return (/^javascript\:/i).test($(this).attr('href')); 
    }).each(function() { 
     var hrefscript = $(this).attr('href'); 
     hrefscript = hrefscript.substr(11); 
     $(this).data('hrefscript', hrefscript); 
    }).click(function() { 
     var hrefscript = $(this).data('hrefscript'); 
     eval(hrefscript); 
     return false; 
    }).attr('href', '#'); 
} 

//Removes warnings from Save buttons, links, etc, that have been can be given "no-warn" or "no-warn-validate" css class 
//"no-warn-validate" inputs/links will only remove warning after successful validation 
//use the no-warn-validate class on buttons/links that cause validation. 
//use the no-warn class on controls that have CausesValidation=false (e.g. a "Save as Draft" button). 
function removeCheckFromNoWarnClasses() { 

    $('.no-warn-validate').click(function() { 
     if (Page_ClientValidate == null || Page_ClientValidate()) { 
      setConfirmUnload(false); 
     } 
    }); 

    $('.no-warn').click(function() { 
     setConfirmUnload(false); 
    }); 
} 

//Adds client side events to all input controls to switch on confirmation onbeforeunload 
function enableUnsavedChangesWarning() { 

    $(':input').one('change', function() { 
     window.onbeforeunload = function() { 
      return 'You have unsaved changes.'; 
     } 
    }); 

    removeCheckFromNoWarnClasses(); 
} 

而在我的ASP.NET页面,当用户进行了更改:

if (changed) 
    { 
     ... 
     //Confirm unload if there are unsaved changes. 
     //NB we also have to call fixIEonBeforeUnload() to fix links, done in in page load to include links that are rendered during callbacks 
     ScriptManager.RegisterStartupScript(Page, GetType(), "unsavedchanges", "setConfirmUnload(true);", true); 
    } 
    else 
     ... 

回答

0

另见How to prevent AutoPostBack when DropDownlist is selected using jQuery

//http://msdn.microsoft.com/en-us/magazine/cc163413.aspx 
//https://stackoverflow.com/questions/2424327/prevent-asp-net-dopostback-from-jquery-submit-within-updatepanel 
//Adds an event handler to confirm unsaved changes when an asynchronous postback is initialised by an UpdatePanel 
function setConfirmAsyncPostBack() { 

    if (typeof (Sys.WebForms) === "undefined" || typeof (Sys.WebForms.PageRequestManager) === "undefined") 
     return; 

    var prm = Sys.WebForms.PageRequestManager.getInstance(); 
    prm.add_initializeRequest(confirmAsyncPostBack); 
} 

//An event handler for asynchronous postbacks that confirms unsaved changes, cancelling the postback if they are not confirmed 
//Adds the confirmation to elements that have a css class of "warn" 
function confirmAsyncPostBack(sender, args) { 
    if (window.onbeforeunload != null && args.get_postBackElement().className == "warn" && !unloadConfirmed()) 
     args.set_cancel(true); 
} 

//Displays a confirmation dialog that imitates the dialog displayed by onbeforeunload 
function unloadConfirmed() { 

    var confirmed = confirm("Are you sure you want to navigate away from this page?\n\n" + unloadMessage() + "\n\nPress OK to continue or Cancel to stay on the current page."); 
    if (confirmed) 
     window.onbeforeunload = null; 
    return confirmed; 
} 
相关问题