jsTree कैसे ajax यूआरएल बदल सकते हैं और डेटा

$('#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"] 
    });

मैं url (या चर _id बदल जाएगा) और फिर डेटा ताज़ा बदलने की जरूरत है फिर से लोड करने। लेकिन ऐसा लगता है कि कैश समस्या है।jsTree कैसे ajax यूआरएल बदल सकते हैं और डेटा

मैंने HTTP अनुरोध की निगरानी की, अनुरोध param _id नहीं बदला।

मैं

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

की कोशिश की है और यह काम नहीं किया।

बीटीडब्ल्यू, मेरा जेएसटी.जेएस संस्करण 3.0.8 है।

स्रोत

2014-11-04 wtf512

और मैं मानता हूं कि मैं '$ ('# jstree_demo_div2') का उपयोग करता हूं। Jstree ('refresh'); 'डेटा को रेफ्रिजर करने के लिए, param' _id' बदल दिया गया है। – wtf512

उम्मीद है कि यह मदद करता है: http://stackoverflow.com/questions/26270239/creating- गतिशील-jstree-using-alternative-json-format-stored-in-array/26299310#26299310 आप AJAX लौटा जेसन को सरणी में बदल सकते हैं –

एक सामान्य jquery AJAX कॉल करें और जब भी आप नए यूआरएल के साथ AJAX कॉल करते हैं, तो सरणी को प्रतिक्रिया दें और पेड़ को इस तरह रीफ्रेश करें: $ ('# jstree')। Jstree (true) .settings.core.data = arrayCollection ; $ ('# Jstree') jstree (सही) .refresh()।; सलाह के लिए –

मैं आपके उपयोग के मामले का परीक्षण करने के लिए निम्नलिखित कोड का उपयोग कर रहा हूं। यह पूरे पेड़ को तोड़ने के बिना जेएसटी को ताज़ा कर रहा है।

<!DOCTYPE html> 

<html> 
    <head> 
     <title>JSTree</title> 
     <link rel="stylesheet" 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>

नोट:
एक ब्राउज़र में ऊपर पेज खोलने के बाद, सभी नोड्स और jstree के बच्चे नोड्स खोलें।
नोकिया बटन जोड़ें पर क्लिक करें।
यह नोकिया लुमिया नोड को मोबाइल फोन नोड में पेड़ नोड रूट करने के बिना जोड़ देगा।
इसी तरह हटाएं डालमिया बटन पर क्लिक करें।
और यह डॉग्स नोड से डाल्मेटियन नोड को हटा देगा और रूट नोड को ध्वस्त किए बिना नई संरचना को प्रदर्शित करने के लिए पेड़ को रीफ्रेश करेगा।

स्रोत

2014-11-17 06:52:49

प्रश्न का उत्तर देने वाला कोड केवल 'resfreshJSTree' की सामग्री है समारोह। '$ ('# jstree')। jstree (true) .settings.core.data = 'put/the/url/here.json';' और '$ ('# jstree')। jstree (true) .refresh (); ' –

मेरे लिए क्या काम किया: ' $ ('# jstree')। Jstree (true) .settings.core.data = {'url': 'put/the/url/here.json'}; ' –

$ ('# jstree')। jstree (true) .settings.core.data.url = 'put/the/url/here.json'; –

jsTree कैसे ajax यूआरएल बदल सकते हैं और डेटा

उत्तर

संबंधित मुद्दे