Home > Developer > Web Develop
<! DOCTYPE html>
<% @page contenttype= "text/html" pageencoding= "UTF-8"%>
<%@ page iselignored= "false"%>
<% @include file= "/jsp/common/meta.jsp"%>
<% @include file= "/jsp/common/taglibs.jsp"%>
<link type= "Text/css" rel= "stylesheet" href= "<%=request.getcontextpath ()%>/css/ztree/ztreestyle/ Ztreestyle.css ">
<script type= "Text/javascript" src= "<%=request.getcontextpath ()%>/js/ztree/jquery.ztree.all.min.js" > </script>
<title> Data Maintenance Tree </title>
<script type= "Text/javascript" >
$ (function () {
Inittree ();
});
/* Initialize tree */
function Inittree () {
$.fn.ztree.init ($ ("#tree"), {
Async: {
Enable:true,
Url:geturl,
Datafilter:ajaxdatafilter
},
Data: {
Simpledata: {enable:true}
},
View: {
Expandspeed: ""
},
Callback: {
Beforeexpand:beforeexpand,
Onclick:onclick,
Onasyncsuccess:onasyncsuccess,
Onasyncerror:onasyncerror
}
},[{"id": "1", "PId": "1", "Name": "Project", "Code": "0001", "type": "Cctype", "Isparent": "true", "Nocheck": "true"}]);
var tree = $.fn.ztree.getztreeobj ("tree");
var treenodes = Tree.getnodes ();
if (Treenodes.length > 0) {
Tree.expandnode (Treenodes[0],true,false,false);
}
}
/* Get the URL */
function GetUrl (treeid,treenode) {
Return "/civilizationconstruction/standarditemtype!typetree.action?parentid=" +treenode.id;
}
/* Data preprocessing */
function Ajaxdatafilter (treeid,parentnode,responsedata) {
var list = Responsedata.list;
if (!list) {
return null;
}
var nodes = [];
for (var i = 0; i < list.length; i++) {
Nodes[i] = {
"id": list[i].id,
"PId": List[i].pid,
"Name": List[i].name,
"Code": List[i].code,
"Type": List[i].type,
"Isparent": (list[i].type== "Ccitem"? " False ":" true "),
"Nocheck": "True"
};
}
return nodes;
}
/* Parent Node expansion Pre-event callback */
function BeforeExpand (treeid,treenode) {
if (!treenode.isajaxing) {
return true;
}else{
Alert ("Loading the project type data, expand the node later!") ");
return false;
}
}
/* Node Click Callback */
function OnClick (event,treeid,treenode) {
var tree = $.fn.ztree.getztreeobj ("tree");
var params = "";
params + = "? id=" +$ (TreeNode). attr ("id");
params + = "&name=" +$ (TreeNode). attr ("name");
params + = "&pid=" +$ (TreeNode). attr ("pid");
params + = "&code=" +$ (TreeNode). attr ("code");
params + = "&type=" +$ (TreeNode). attr ("type");
$ ("#rframe", Window.parent.document). attr ("src", encodeURI ("/civilizationconstruction/standarditemtype! Tagsbus.action "+params)");
}
/* Load Normal Event callback asynchronously */
function Onasyncsuccess (event,treeid,treenode,msg) {}
/* Asynchronous Load Exception Event callback */
function Onasyncerror (event,treeid,treenode,xmlhttprequest,textstatus,errorthrown) {
Alert ("Load check item type Exception! ");
Treenode.icon = "";
}
/* Overloaded nodes */
function Reloadtreenode (Treenodeid) {
var tree = $.fn.ztree.getztreeobj ("tree");
var treeNode = Tree.getnodebyparam ("id", Treenodeid);
Tree.reasyncchildnodes (TreeNode, "refresh");
}
</script>
<body>
<div><ul id= "tree" class= "Ztree" ></ul></div>
</body>
The above is the use of Ztree plug-ins in the project, do the tree structure encountered in the AJAX cache problem, the cache only in IE, the use of other browsers no problem, for the problem in IE, the solution: is to add JS code on the Rframe page as follows:
<script type= "Text/javascript" >
$.ajaxsetup ({
Cache:false//Turn off AJAX-appropriate caches
});
</script>
Of course, also found on the Internet other methods (of course, I have not tested, interested can try): divided into client-side solutions and services to solve
1. Client Solutions
IE Access policy: Internet Options--browsing history--settings--Options for temporary Internet files are changed every time you visit a webpage
1: Add a random function to the page after the AJAX request, we can use the random time function
Add T=math.random () after the URL sent by javascript
For example: url+ "&" + "t=" +math.random (); or new Date ();
2: Add Xmlhttprequest.setrequestheader ("If-modified-since", "0") before XMLHttpRequest sends the request
In general, the XMLHttpRequest here will not be used directly
You should be able to find this code.
Xxxxx.send (YYYYYY);
So, turn it into
Xxxxx.setrequestheader ("If-modified-since", "0");
Xxxxx.send (YYYYYY);
The practice proves that both methods are very effective.
1. Add header ("Cache-control:no-cache, Must-revalidate") on the service side;
2. Add Xmlhttprequest.setrequestheader ("If-modified-since", "0") to Ajax before sending the request;
3. Add Xmlhttprequest.setrequestheader ("Cache-control", "No-cache") to Ajax before sending the request;
4. Add "? fresh=" + math.random () after the URL parameter of Ajax; Of course, this parameter fresh can be arbitrarily taken.
5. The fourth method is similar to the third one, after the URL parameter, add "? timestamp=" + New Date (). GetTime (); It is recommended to use this method
6. Replace get with post: not recommended
2. Server-side solution:
Take Struts2 as an example:
Struts2 Server-side usage
XML code
The code is as follows:
Java code
Private static final long serialversionuid = 1L;
Public String intercept (actioninvocation invocation) throws Exception {
Actioncontext context = Invocation.getinvocationcontext ();
HttpServletResponse response = (httpservletresponse) context.get (strutsstatics.http_response);
if (response! = NULL) {
Response.setheader ("Cache-control", "No-cache");
Response.setheader ("Pragma", "No-cache");
Response.setheader ("Expires", "1");
}
return Invocation.invoke ();
}
}
Ajax caching problems in IE
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
