Use userdata to save form data on the client

Source: Internet
Author: User

For most users who make webpages, the information stored on the webpage form on the client is mostly implemented using the cookie technology. These functions include the option selected in the drop-down list box, text Box input data. In fact, we can use the userdata behavior in the default behavior of Microsoft DHTML to implement this function.

Many netizens have sorted out these questions and provided three examples. The following describes how to use this behavior:

Userdata behavior (userdata behavior ):

1. Description:

Userdata writes data to a userdata store to save the data. userdata can save the data in XML format on the client computer, if you are using Windows 2000 or Windows XP, it is saved in the C: \ Documents ents and Settings \ liming \ userdata \ folder (if the operating system is not installed on drive C, C should be the partition of the operating system ).

This data will always exist unless you manually delete the data or use a script to set the expiration time of the data.

Userdata provides a more dynamic and large data structure than cookies. The size of each page's userdata storage area can reach 64 KB, and each domain name can reach 640 kb.

Userdata behavior allocates a userdata storage area for each object through sessions. Use the SAVE and load methods to save the userdata stored in the cache. Once the userdata storage area is saved, even if the IE browser is closed or refreshed, the next time you enter the page, the data can be reloaded without being lost.

For security reasons, the same protocol uses the same folder to save data in the userdata storage area.

For security reasons, a userdata store is available only in the same directory and with the same protocol used to persist the store.

When userdata is applied to HTML, Head, title, and style tags, an error occurs when the SAVE and load methods are used.

Setting the userdata behavior (proposed) class on the HTML, Head, title, or style object causes an error when the Save or load method is called.

The following style must be announced in the line or in the head section of the document:

<Style>

. Userdata {behavior: URL (# default # userdata );}

</Style>

Userdata behavior can be used by Microsoft? Win32? And IE 5.0 or later versions on UNIX platforms. Netscape is not supported.

2. Syntax:

HTML <element style = "behavior: URL ('# default # userdata')" id = Sid>

Script object. style. Behavior = "URL ('# default # userdata ')"

Object. addbehavior ("# default # userdata ")

Note: The SID parameter is a unique ID that describes the tag. ID is optional, but you can easily control the flag in the script.

3. Members:

Expires

Set or obtain the expiration date for storing data using userdata.

Script Syntax: Object ID. expires = parameter

The parameter is a string that uses the Universal Time Coordinate format to indicate the expiration date. This attribute can be read and written, with no default value. The browser compares this date with the current date. If it expires, the data will automatically expire.

Getattribute ()

Obtains the specified property value.

Load (storage zone name)

Load the stored object data from the userdata storage area.

Removeattribute ()

Deletes a specified property value from an object.

Save (storage zone name)

Store object data in a userdata storage area.

Setattribute ()

Set the specified property value.

Xmldocument

Obtain the xml dom reference that stores the object data.

For detailed usage, see msdn (http://msdn.microsoft.com)

4. Example

Example 1: text box tagged applications (Microsoft)

CodeAs follows:


<HTML> <br/> <pead> <br/> <style> <br/>. userdata {behavior: URL (# default # userdata) ;}< br/> </style> <br/> <SCRIPT> <br/> function fnsaveinput () {<br/> var opersist = opersistform. opersistinput; <br/> opersist. setattribute ("spersist", opersist. value); // set opersist. value is stored as the spersist attribute <br/> opersist. save ("oxmlbranch"); // stored in the userdata storage area named oxmlbranch <br/>}< br/> function fnloadinput () {<br/> var opersist = opersistform. opersistinput; <br/> opersist. load ("oxmlbranch"); // load it in the userdata storage area named oxmlbranch <br/> opersist. value = opersist. getattribute ("spersist"); // assign the spersist attribute to opersist. value <br/>}< br/> </SCRIPT> <br/> </pead> <br/> <body> <br/> <Form ID = "opersistform"> <br/> <input class = "userdata" type = "text" id = "opersistinput"> <br/> <input type = "button" value = "LOAD" onclick = "fnloadinput () "> <br/> <input type =" button "value =" save "onclick =" fnsaveinput () "> <br/> </form> <br/> </body> <br/> </ptml>
[Ctrl + A select all prompt: you can modify part of the code first, then click to run the Code]

Example 2: Application of checkbox flag

The Code is as follows:


<textarea class="bk" id="temp79231" onmouseover="this.select();" rows="12" wrap="soft" cols="20" style="WIDTH: 90%"><Style> <br/>. userdata {behavior: URL (# default # userdata );} <br/> </style> <br/> <input type = checkbox id = chkbox1 class = userdata> <br/> <SCRIPT> <br/> var OBJ = document. all. chkbox1; <br/> obj. attachevent ('onclick', savechecked) <br/> function savechecked () {<br/> obj. setattribute ("bcheckedvalue", obj. checked); <br/> obj. save ("ochkvalue"); <br/>}< br/> window. attachevent ('onload', loadchecked) <br/> function loadch Ecked () {<br/> obj. Load ("ochkvalue"); <br/> var chk = (obj. getattribute ("bcheckedvalue") = "true ")? True: false; <br/> obj. Checked = chk; <br/>}< br/> </SCRIPT></textarea>
[Ctrl + A select all prompt: you can modify part of the code first, then click to run the Code]

Example 3: Select tag Application

The Code is as follows:


<Style> <br/>. userdata {behavior: URL (# default # userdata );} <br/> </style> <br/> <select id = "select1" class = "userdata"> <br/> <option> option1 </option> <br/> <option> option2 </option> <br/> <option> option3 </option> <br/> <option> option4 </option> <br/> </select> <br/> <SCRIPT> <br/> var OBJ = document. all. select1; <br/> obj. attachevent ('onchang', saveselectedindex) <br/> function saveselectedindex () {<br/> obj. setattribute ("sselectvalue", obj. selectedindex); <br/> obj. save ("osltindex"); <br/>}< br/> window. attachevent ('onload', loadselectedindex) <br/> function loadselectedindex () {<br/> obj. load ("osltindex"); <br/> obj. selectedindex = obj. getattribute ("sselectvalue"); <br/>}< br/> </SCRIPT>
[Ctrl + A select all prompt: you can modify part of the code first, then click to run the Code]

From: http://www.g22.net/Article/Show.asp? Id = 667

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.