An automatic save draft for Ajax JSP implementations

Source: Internet
Author: User
Tags object return time interval

One, form part (index.html)
The first is a form Fill page, with a div with ID autosavemsg to display the return information, and a checkbox with an ID of draft_autosave to determine whether to save automatically, and then name the textarea ID as message. In order to meet the needs of multiple users at the same time, plus the user name, each user's draft separately saved. To illustrate the convenience, here are some cosmetic things to remove, so that looks more clear
<!--user name defaults to Noname-->
User name:
<input type= "text" name= "MemName" id= "MemName"
Size= "value=" "NONAME" disabled= "true"/>
<!--invoke the Auto Save State setting function in the onclick event of the AutoSave option-->
<input onclick= "Setautosave (); type= checkbox" id= "Draft_autosave" value= "1" checked= "true"/> automatically save?

Content:
<textarea cols=40 rows=8 id= "message" > your edited content will be automatically saved in order to restore </textarea><br/><br
<!--autosavemsg display return information-->
<div id= "autosavemsg" ></div><br/>
<input type= "Submit" onclick= "Save ();" Value= "Save"/>
<!--call function to restore the last saved draft-->
<input type= "button" onclick= "Autosaverestore ();" value= "Restore"/>
</div>
</div>
<!--Place the JS code behind all objects to prevent errors that do not exist when the page is not loaded-->
<!--Ajax class-->
<script type= "Text/javascript" src= "Ajaxrequest.js" ></script>
<!--automatically save code-->
<script type= "Text/javascript" src= "Autosave.js" ></script>

II. Automatic save Code (AUTOSAVE.JSP):
Set Global variables First
The Content object to save Formcontent
var formcontent;
Display objects that return information
var Autosavemsg=document.getelementbyid ("Autosavemsg");
User name
var Memname=document.getelementbyid ("MemName"). Value;
Automatic save time interval
var autosavetime=10000;
Timer Object
var Autosavetimer;
Set up an automatic save state first
Setautosave ();
Auto Save function
function AutoSave () {
Formcontent=document.getelementbyid ("message");
If the content or user name is empty, it is not processed and returned directly
if (! Formcontent.value!memname) return;
Creating Ajaxrequest Objects
var ajaxobj=new ajaxrequest;
Ajaxobj.url= "autosave.jsp";
Ajaxobj.content= "Action=autosave&memname=" +memname+ "&postcontent=" +formcontent.value;
Ajaxobj.callback=function (xmlobj) {
Show feedback Information
Autosavemsg.innerhtml=xmlobj.responsetext;
}
Ajaxobj.send ();
}
Set Auto Save state function
function Setautosave () {
Do you want to save it automatically?
if (document.getElementById ("Draft_autosave"). Checked==true)
Yes, set the timer

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.