jsTree comment changer l'url ajax et récupérer les données

    $('#jstree_demo_div2').jstree({
        'core': {
            'data': {
                "url": "tree.ashx?id=" + _id,
                "dataType": "json" //needed only if you do not supply JSON headers
            }
        },
        "checkbox": {
            'visible': true,
            'keep_selected_style': false, 
        },
        "plugins": ["wholerow", "checkbox"]
    });

J'ai besoin de changer l'url (ou de la variable _id va changer), puis d'actualiser les données.
Mais il semble y avoir un problème de cache.

J'ai surveillé la requête HTTP, la demande de param _id n'a pas changé.

J'ai essayé

'core': {
                'data': {
                    "url": "tree.ashx?id=" + _id,
                    "cache":false, //←←←←
                    "dataType": "json" //needed only if you do not supply JSON headers
                }
            },

et ça ne fonctionne pas.

BTW, mon jsTree.js version 3.0.8.

Et beform-je utiliser $('#jstree_demo_div2').jstree('refresh'); à refrase les données, les param _id a été changé.
espérons que cela aide: stackoverflow.com/questions/26270239/... vous pouvez stocker l'ajax json retourné dans la variable de type arraycollection
faire un normal ajax de jquery appel et à chaque fois que vous effectuez un appel ajax avec la nouvelle url, affecter la réponse de type arraycollection et actualiser l'arbre de cette façon: $('#jstree').jstree(true).les paramètres.de base.données = type arraycollection; $('#jstree').jstree(true).refresh();
Merci pour les conseils. Mais il semble y avoir quelques problèmes: 1)L'opération d'actualisation des effondrements de l'ensemble de l'arbre 2)Le "statut" déposée (cochez la case) ne fonctionne pas

OriginalL'auteur wtf512 | 2014-11-04

  1. 8

    J'utilise le code suivant pour tester votre cas d'utilisation. C'est l'actualisation de la jstree sans s'effondrer l'ensemble de l'arbre.

    <!DOCTYPE html>

<html>
    <head>
        <title>JSTree</title>
        <link  href="dist/themes/default/style.css" />
        <script src="dist/libs/jquery.js"></script>
        <script src="dist/jstree.js"></script>
        <script>
            var arrayCollection;
            $(function() {
                arrayCollection = [
                    {"id": "animal", "parent": "#", "text": "Animals"},
                    {"id": "device", "parent": "#", "text": "Devices"},
                    {"id": "dog", "parent": "animal", "text": "Dogs"},
                    {"id": "lion", "parent": "animal", "text": "Lions"},
                    {"id": "mobile", "parent": "device", "text": "Mobile Phones"},
                    {"id": "lappy", "parent": "device", "text": "Laptops"},
                    {"id": "daburman", "parent": "dog", "text": "Dabur Man", "icon": "/"},
                    {"id": "dalmatian", "parent": "dog", "text": "Dalmatian", "icon": "/"},
                    {"id": "african", "parent": "lion", "text": "African Lion", "icon": "/"},
                    {"id": "indian", "parent": "lion", "text": "Indian Lion", "icon": "/"},
                    {"id": "apple", "parent": "mobile", "text": "Apple IPhone 6", "icon": "/"},
                    {"id": "samsung", "parent": "mobile", "text": "Samsung Note II", "icon": "/"},
                    {"id": "lenevo", "parent": "lappy", "text": "Lenevo", "icon": "/"},
                    {"id": "hp", "parent": "lappy", "text": "HP", "icon": "/"}
                ];
                $('#jstree').jstree({
                    'core': {
                        'data': arrayCollection
                    },
                    "checkbox": {
                        'visible': true,
                        'keep_selected_style': false
                    },
                    "plugins": ["wholerow", "checkbox"]
                });
            });
            function resfreshJSTree() {
                $('#jstree').jstree(true).settings.core.data = arrayCollection;
                $('#jstree').jstree(true).refresh();
            }
            function addNokia() {
                var nokia = {"id": "nokia", "parent": "mobile", "text": "Nokia Lumia", "icon": "/"};
                arrayCollection.push(nokia);
                resfreshJSTree();
            }
            function deleteDalmatian() {
                arrayCollection = arrayCollection
                        .filter(function(el) {
                            return el.id !== "dalmatian";
                        });
                resfreshJSTree();
            }
        </script>
    </head>
    <body>
        <input type="button" onclick="addNokia()" value="Add Nokia"/>
        <input type="button" onclick="deleteDalmatian()" value="Delete Dalmatian"/>
        <div id="jstree"></div>
    </body>
</html>
    • Remarque:
    • Après l'ouverture de la page mentionnée ci-dessus dans un navigateur, Ouvrez tous les noeuds noeuds enfants et de la jstree.
    • Cliquez sur Ajouter Nokia bouton.
    • Il va ajouter Nokia Lumia nœud de Téléphones Mobiles nœud sans s'effondrer
      l'arbre à nœud racine.
    • De la même façon cliquez sur Supprimer Dalmaitian bouton.
    • Et il va supprimer Dalmate nœud de Chiens nœud et rafraîchit l'
      l'arborescence pour afficher la nouvelle structure sans s'effondrer à nœud racine.
    Le code qui répond à la question est juste le contenu de la resfreshJSTree fonction. $('#jstree').jstree(true).settings.core.data = 'put/the/url/here.json'; et $('#jstree').jstree(true).refresh();
    Ce qui a fonctionné pour moi: $('#jstree').jstree(true).settings.core.data = { 'url': 'put/the/url/here.json' };
    $('#jstree').jstree(true).les paramètres.de base.les données.url = '/le/url/ici.json";
    Merci Quick_Silver . C'enregistrer mon temps.

    OriginalL'auteur Quick_Silver