Fancytree State hold

Source: Internet
Author: User

Fancytree Very good tree control

examples:http://wwwendt.de/tech/fancytree/

How to save the selected state of a tree node, whether the page is refreshed or the Ajax duplicate request is kept in the last state?

Fancytree provides a state persistence save extension with the following scenario:

Https://github.com/mar10/fancytree/wiki/ExtPersist

$ ("#tree"). Fancytree ({extensions: ["Persist"], checkbox:true, persist: {//Available options with their default:Cookiedelimiter: "~",//character used to join key stringsCookieprefix:undefined,//' fancytree-<treeid>-' by defaultCookie: {//settings passed to Jquery.cookie pluginRawfalse, Expires:"", Path:"", Domain:"", Secure:false}, Expandlazy:false,//true:recursively expand and load lazy nodesOverridesource:true,//True:cookie takes precedence over ' source ' data attributes.Store: "Auto",//' cookies ': Use cookies, ' local ': Use Localstore, ' session ': Use SessionstoreTypes: "Active expanded focus selected"//which status types to store  },  [...]});
Options
  • Cookiedelimiter, type: {string}, Default: ' ~ '
    Character used to join key strings.

  • Cookieprefix, type: {string}, default: ' fancytree-<treeid>-'
    Used to generate storage keys.

  • Cookie, type: {object}, default:use a session cookie
    Options passed to $.cookie plugin (only if the cookie is used; see also ' store ' option).

  • Expandlazy, type: {Boolean}, Default:false
    true: recursively expand and load lazy nodes.

  • Fireactivate, type: {Boolean}, Default:true
    false: Suppress activate event after active node is restored.

  • Overridesource, type: {Boolean}, Default:true
    true: persisted information would be used, even if source data are set to true or false .
    false: persisted information would only be used if source data is undefined .

  • Store, type: {string}, default: ' Auto '
    Storage type ' local ': Localstorage, ' Session ': sessionstorage, ' cookie ': Use Js-cookie (or Jquery-cookie) plugin.
    ' Auto ': Use Sessionstorage if available, fallback to cookie.
    Use ' Local ' (or ' cookies ' with expiration settings) to the store status over sessions.

  • Types, type: {string}, default: ' Active expanded focus selected '
    Which status types to store, separated by space.

Events
    • Restore
      Fired after tree status is restored.
Methods
      • {void} tree.clearCookies(types)
        Reset persistence data.
        {string} [types= ' active expanded focus selected ']

Note here:Cookieprefix, if you do not set this value, each time the AJAX request tree is not the same (not refresh the page), can not achieve the effect of holding state, after setting this value, regardless of the Refresh page or Ajax request, will be able to maintain the state.

Reference: Http://stackoverflow.com/questions/33147617/fancytree-only-loads-persist-state-after-page-refresh

Cookie: {expires:365}, you can set the expiration date of the cookie, and of course there are several other storage options available

Fancytree State hold

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.