JSTree loading lazy loading not working for my resource url but is for sample url

Viewed 491

I am loading data as per an example I found using the code below. It allows me to specify a url and using the sample's url https://www.jstree.com/fiddle/?lazy I get a working tree on my page. This url returns a json of:

[{"id":1,"text":"Root node","children":[{"id":2,"text":"Child node 1","children":true},{"id":3,"text":"Child node 2"}]}]

I have created my own url which returns exactly the same json. My problem is that using my url it delivers a single tree node with my json string as the name of the node as per my attached image. As far as I can see both urls are returning the same json string and is just raw text but I don't understand why it is interpreting mine incorrectly. Could anyone help me understand what I am doing wrong?

    $(function() {
      $('#jstree').jstree({
        'core' : {
          'data' : {
            "url" : "/_content/data/table/companytree.aspx/?lazy",
            "data" : function (node) {
              return { "id" : node.id };
            }
          }
        }
      });
    });

apologies I added the wrong code snippet

The first image is using the sample url and the second is using mine..

working tree:

Error tree

2 Answers

Only thing I can think of, while server is returning the data it need to have the response header. Please check this, I think thats the issue, rest looks good to me.

content-type: application/json; charset=utf-8

You can also try once, adding the contentType, I have not used this structure exactly, but generally this will tell that the return type is json incase thats not in header.

$(function() {
      $('#jstree').jstree({
        'core' : {
          'data' : {
            "url" : "/_content/data/table/companytree.aspx/?lazy",
            "contentType": "application/json; charset=utf-8",
            "data" : function (node) {
              return { "id" : node.id };
            }
          }
        }
      });
    });

I added this code to my aspx code which fetches the data to post back to the page.. Instead of posting the json to the page I return a http response.. It works for me but would love to know why the demo approach didn't. Content type seems the likely culprit bit I don't know.

        Response.ContentType = "application/json"
        Response.ContentEncoding = Encoding.UTF8

        Dim bom As Byte() = Encoding.UTF8.GetPreamble()
        Response.BinaryWrite(bom)
        Response.BinaryWrite(Encoding.UTF8.GetBytes(PageDataRecords))
        Response.Flush()
        Response.End()
Related