Implementation code for automatic saving of Ajax + JSP drafts

Time:2021-10-13

1、 Form part   (index.html)

     The first is the form filling page. A div with ID autosavemsg is used to display the return information, and a div with ID draft is used_ Autosave’s checkbox to determine whether to save automatically, and then name the ID of textarea as message. At the same time, in order to meet the needs of multiple users at the same time, the user name is added, and the drafts of each user are saved separately. For the convenience of explanation, some modifying things are removed here to make it more clear

<h2>Automatic saving of Ajax Application drafts < / H2 > < br  />

<!–   The user name defaults to noname  –>

user name:
<input type=”text” name=”memName” id=”memName” 
    size=”20″ value=”NONAME” disabled=”true” /> &nbsp;&nbsp;&nbsp;&nbsp;

<!–   Invoking the auto save state settings function in the onclick event of the auto save option  –>

<input   onclick=”SetAutoSave();”   type=”checkbox”   id=”Draft_AutoSave”   value=”1″   checked=”true”  /> Auto save?
<br /><br />

Content:
<textarea   cols=40   rows=8   Id = “message” > the content you edited will be automatically saved to restore < / textarea > < br  />< br  />

<!–   Autosavemsg displays the returned information  –>
<div id=”AutoSaveMsg”></div><br />

<input type=”submit” onclick=”Save();” value=”Save” />&nbsp;&nbsp;

<!–   Call the function to restore the last saved draft  –>
<input type=”button” onclick=”AutoSaveRestore();” value=”Restore” />
</div>
</div>

<!–   Put JS code behind all objects to avoid the error that the object does not exist when the page is not loaded  –>
|<!–   Ajax class  –>
<script type=”text/javascript” src=”ajaxrequest.js”></script>
<!–   Auto save code  –>
<script type=”text/javascript” src=”autosave.js”></script>

2、 Autosave code (autosave. JSP):

  //  Set global variables first
//   Content object to save formcontent
var FormContent;
//   Displays the object that returns the information
var AutoSaveMsg=document.getElementById(“AutoSaveMsg”);
//   user name
var memName=document.getElementById(“memName”).value;
//   Auto save interval
var AutoSaveTime=10000;
//   Timer object
var AutoSaveTimer;
//   First, set the auto save status once
SetAutoSave();
//   Auto save function
function AutoSave() {
     FormContent=document.getElementById(“message”);
    //  If the content or user name is empty, it will not be processed and will be returned directly
    if(!FormContent.value||!memName) return;
    //  Create an Ajax request object
    var ajaxobj=new AJAXRequest;
    ajaxobj.url=”autosave.jsp”;
    ajaxobj.content=”action=AutoSave&memname=”+memName+”&postcontent=”+FormContent.value;
    ajaxobj.callback=function(xmlObj) {
        //  Show feedback
        AutoSaveMsg.innerHTML=xmlObj.responseText;
    }
    ajaxobj.send();
}
//   Set auto save status function
function SetAutoSave() {
    //  Save automatically?
    if(document.getElementById(“Draft_AutoSave”).checked==true)
        //  Yes, set the timer
        AutoSaveTimer=setInterval(“AutoSave()”,AutoSaveTime);
    else
        //  No, clear the timer
        clearInterval(AutoSaveTimer);
}
function   AutoSaveRestore()   {//   Restore last saved draft
      Autosavemsg. InnerHTML = “recovering, please wait…”
     FormContent=document.getElementById(“message”);
    //  If the user name is empty, it will not be processed and will be returned directly
    if(!memName) return;
    //  Create an Ajax request object
    var ajaxobj=new AJAXRequest;
    ajaxobj.url=”autosave.jsp”;
    ajaxobj.content=”action=Restore&memname=”+memName;
    ajaxobj.callback=function(xmlObj) {
         //  Show feedback
      if(xmlObj.responseText!=””) {
         //  Restore draft
          var   s=xmlObj.responseText.replace(/^[\n|\r\n]*|[\n|\r\n]*$/g,”);// Remove blank lines
         FormContent.innerText=s;
          //  Prompt the user that the recovery is successful
         Autosavemsg. InnerHTML = “restore succeeded”;
        }
    }
    ajaxobj.send();
}
function   Save()   {/ / saving the contents to the database is not complete
 FormContent=document.getElementById(“message”);
    //  If the content or user name is empty, it will not be processed and will be returned directly
    if(!FormContent.value||!memName) return;
    //  Create an Ajax request object
    var ajaxobj=new AJAXRequest;
    ajaxobj.url=”autosave.jsp”;
    ajaxobj.content=”action=Save&memname=”+memName+”&postcontent=”+FormContent.value;
    ajaxobj.callback=function(xmlObj) {
        //  Show feedback
        AutoSaveMsg.innerHTML=xmlObj.responseText;
    }
    ajaxobj.send();

III    Finally, autosave.jsp is used to save the draft in the background:
Program code:

<%@ page contentType=”text/html; charset=gb2312″ %>
<%@ page import=”java.util.*” %>
<%@ page import=”java.io.*” %>

<%
  String PostContent,memName,action;
  String filename;
  File f; 
  FileWriter fw;
    action=request.getParameter(“action”);// Gets the action, whether to save or restore the draft

  // Get user name
   memName=request.getParameter(“memname”);

  // Get draft content
   PostContent=request.getParameter(“postcontent”);

   filename=memName+”.txt”;// Save Draft file
  filename= request.getRealPath(“/temp/”+filename);
   if(action.equals(“Save”)||action.equals(“AutoSave”)){  // The two actions are merged here, and the code saved to the database is not written
    f = new File(filename);
     If (! F.exists()) / / if the file does not exist, create a
    {
      f.createNewFile();
    }
    fw  =  new   FileWriter(filename);  // Create a FileWrite object and set it to be referenced by the FW object variable
   PostContent=new String(PostContent.getBytes(“ISO8859_1″),”UTF-8”);

   fw.write(PostContent);
    fw.close();  // Close file
     Out. Println (“last on” + NEW   Date(). Tostring() + “auto save succeeded!! 1”);

   } else   If (action. Equals (“restore”) {/ / restore operation
      FileReader   fr  =  new   FileReader(filename);  // Create a FileReader object and set it to be referenced by the fr object variable
      BufferedReader   br  =  new   BufferedReader(fr);  // Create a BufferedReader object and set it to be referenced by the br object variable  
    StringBuffer bf=new StringBuffer(); 
    String Line; 
     while((Line  =  br.readLine())!=null){  // Read a row of data
      bf.append(Line+”\n”);
    }
    out.print(bf.toString().trim());
  }else{
     out.println(”   An error occurred “”);
  }

%>

4、 Please download the Ajax class (ajaxrequest. JS).  

Recommended Today

Swift advanced (XV) extension

The extension in swift is somewhat similar to the category in OC Extension can beenumeration、structural morphology、class、agreementAdd new features□ you can add methods, calculation attributes, subscripts, (convenient) initializers, nested types, protocols, etc What extensions can’t do:□ original functions cannot be overwritten□ you cannot add storage attributes or add attribute observers to existing attributes□ cannot add parent […]