Alert ,when clicking on to diff tab ,before saving

There are many tabs in my page,I want to give an alert box which says "Do you want to save the changes?" if user changes anything in the page,without clicking on the save button provided 开发者_高级运维in the page,he is clicking on diff tab.

I guess JavaScript can handle this. For this, technically there are different way. One of this is to have a function that will validate if there are any changes on the fields/pages. This function will be called first by the other tabs function.

Upon loading of the page, store all the value of the fields in one variable or hidden fields as concatenated. But you can separate it by variable then concatenate it later.

ex. var gOldValue = 'value1value2value3....'; //The value1.... is generated via JSP

Create a function that will compare the gOldValue value to the current value of all fields that are included in the gOldValue which is the basis if there are changes in the pages.

function isPageChanged(form){
    var currentValue = "";
    for(var i = 0; i < form.length; i++){
         //Assuming all elements in the form have the value that stored in `gOldValue`
         //upon loading. Now check its current value if will be same.
         currentValue += form.elements(i).value;
    }

    //Return a value that will indicate that pages have been changed
    if(gOldValue != currentValue){
         return true;             
    }         
    return false;

} 

Your other tabs may call first the isPageChanged() function before executing its main function.

<input type="button" onClick="showNextPage()" value="Next" />....

 function showNextPage(){
     if(isPageChanged()){
         var isConfirm = confirm("Do you want to save changes");
         if(isConfirm){
             //Save the changes
         }
     }
     //Else do some stuff...

 }