?
Solved

How do I warn the user of unsaved changes when leaving a page in ASP.NET(VB)?

Posted on 2015-01-08
6
Medium Priority
?
1,290 Views
Last Modified: 2015-04-11
I have seen a lot of JS examples, and I'm not sure any of them work for me. I have a lot of controls inside repeaters and datagrids so it makes it cumbersome to track in a client script. Is there a simple way to check if any data in any control has changed since the page load and then generate a warning message?
0
Comment
Question by:Mike Miller
6 Comments
 
LVL 84

Accepted Solution

by:
David Johnson, CD, MVP earned 2000 total points
ID: 40539581
var unsaved = false;
$(":input").change(function(){ //trigers change in all input fields including text type
    unsaved = true;
});

function unloadPage(){ 
    if(unsaved){
        return "You have unsaved changes on this page. Do you want to leave this page and discard your changes or stay on this page?";
    }
}

window.onbeforeunload = unloadPage;

Open in new window

http://bit.ly/1KrqqSA
0
 
LVL 29

Expert Comment

by:Pravin Asar
ID: 40540682
Try the onbeforeunload event: It is fired just before the page is unloaded. It also allows you to ask back if the user really wants to leave. See the demo onbeforeunload Demo.

Alternatively, you can send out an Ajax request when he leaves.

For detailed/field level tracking, you may look at example code @

http://www.telerik.com/forums/warn-users-before-leaving-a-page-with-uncommitted-changes
0
 
LVL 29

Expert Comment

by:Pravin Asar
ID: 40540698
No Points please.

This is a better explaintion.

http://www.4guysfromrolla.com/webtech/100604-1.shtml
0
What is SQL Server and how does it work?

The purpose of this paper is to provide you background on SQL Server. It’s your self-study guide for learning fundamentals. It includes both the history of SQL and its technical basics. Concepts and definitions will form the solid foundation of your future DBA expertise.

 

Author Comment

by:Mike Miller
ID: 40541956
David, what am i missing here?

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="test.aspx.vb" Inherits="testproj.test" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns:o="urn:schemas-microsoft-com:office:office" lang="en-us" dir="ltr">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" />
</div>
</form>
     <script type="text/javascript">
            var unsaved = false;
            $(":input").change(function () { //trigers change in all input fields including text type
                unsaved = true;
            });

            function unloadPage() {
                if (unsaved) {
                    return "You have unsaved changes on this page. Do you want to leave this page and discard your changes or stay on this page?";
                }
            }

            window.onbeforeunload = unloadPage;
    </script>
</body>
</html>

Open in new window

0
 
LVL 75

Expert Comment

by:käµfm³d 👽
ID: 40553283
Have you imported the JQuery library?
0
 

Author Comment

by:Mike Miller
ID: 40574301
Yes, I use jquery elsewhere in my app
0

Featured Post

 [eBook] Windows Nano Server

Download this FREE eBook and learn all you need to get started with Windows Nano Server, including deployment options, remote management
and troubleshooting tips and tricks

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

IntroductionWhile developing web applications, a single page might contain many regions and each region might contain many number of controls with the capability to perform  postback. Many times you might need to perform some action on an ASP.NET po…
Real-time is more about the business, not the technology. In day-to-day life, to make real-time decisions like buying or investing, business needs the latest information(e.g. Gold Rate/Stock Rate). Unlike traditional days, you need not wait for a fe…
This Micro Tutorial will teach you how to add a cinematic look to any film or video out there. There are very few simple steps that you will follow to do so. This will be demonstrated using Adobe Premiere Pro CS6.
Integration Management Part 2
Suggested Courses

850 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question