how to implement dirty bit functionality or some other method in asp.net page

327 Views Asked by At

I have an asp.net page in which I have a ckeditor control and ajax file upload tool. I want to show user certain message when he tries to leave the page without saving data.I am beginner in JavaScript/JQuery and would like to find some easy solution directly implemented into asp.net code.If possible can you provide step by step implementation of dirty bit functionality.

 `<script>
 window.onbeforeunload = function (e) {
 return 'Dialog text here.';
  };
</script>`

Above code shows me the message even if nothing has changed on the page.How do I apply it to specific control like ckeditor/ajaxuploadctrl etc

Below is the HTML code

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div id="DirtyBit">
    <form id="form" runat="server">

       Country : <asp:DropDownList ID="drpCountry" runat="server"></asp:DropDownList>
        <br />
    <table style="width: 100%; height: 337px;">
        <tr>
            <td class="auto-style2">TV&nbsp; :</td>
            <td class="auto-style3"> <CKEditor:CKEditorControl ID="CKTV" BasePath="/ckeditor/" runat="server"
   </CKEditor:CKEditorControl>&nbsp;</td>
        </tr>
       
        <tr>
            <td class="auto-style6">BV :</td>
            <td class="auto-style7"> <CKEditor:CKEditorControl ID="CKBV" BasePath="/ckeditor/"  runat="server">
   </CKEditor:CKEditorControl></td>
        </tr>
       
        <tr>
            <td class="auto-style8">CA :</td>
            <td class="auto-style9"> <CKEditor:CKEditorControl ID="CKCA" BasePath="/ckeditor/" runat="server">
   </CKEditor:CKEditorControl></td>
        </tr>
       
        <tr>
            <td class="auto-style10">CJ :</td>
            <td class="auto-style11"> <CKEditor:CKEditorControl ID="CKCJ" BasePath="/ckeditor/"  runat="server">
   </CKEditor:CKEditorControl></td>
        </tr>
       <tr>
           <td class="auto-style1">
               Visa Form :</td>
           <td><table id="attachedfiles">
               <tr>
                   <td class="auto-style12">
       <asp:ScriptManager runat="server">
</asp:ScriptManager>
<asp:AjaxFileUpload ID="AjaxFileUpload11" runat="server" MaximumNumberOfFiles="5" 
    Width="400px" OnUploadComplete="OnUploadComplete" />
                   </td>
               </tr>
               </table></td>
       </tr>
       <tr>
           <td class="auto-style4">
               </td>
           <td class="auto-style5">
               <asp:Button ID="btnSave" runat="server" Height="30px" OnClick="btnSave_Click" Text="Save" Width="109px" />
                 
           </td>
       </tr>
       <tr>
           <td class="auto-style4">
               &nbsp;</td>
           <td class="auto-style5">
               &nbsp;</td>
       </tr>
    </table>
      
    </form>
        </div>
</asp:Content>

0

There are 0 best solutions below