JSTree not populating properly from JSON Array. If I return a single String it works but not from my Array. Where am I going wrong?

[Timpey83]

I have been trying to get this working for days but failing. If I return a single string using this format from C#:

"{ \"id\": \"" + libraryName + "\", \"parent\": \"#\", \"text\": \"" + libraryName + "\", \"type\": \"FDR\", \"value\": \"0\" }"

It will work but obviously a Tree is no use with a single item! As soon as I add the items to a List or Array (which JSTree needs) then it seems to interpret each String as only a String and doesn't read in any values.

I have set an alert before it builds the tree to double check and it looks to be presenting the data correctly:

{ "id": "New Lib", "parent": "#", "text": "New Lib", "type": "FDR", "value": "0" }, { "id": "40", "parent": "New Lib", "text": "Text TXT", "type": "TXT", "value": "1" }, { "id": "39", "parent": "New Lib", "text": "new 5", "type": "IMG", "value": "2" }, { "id": "34", "parent": "New Lib", "text": "Hi", "type": "FDR", "value": "3" }, { "id": "41", "parent": "34", "text": "Test URL Facebook", "type": "URL", "value": "4" }, { "id": "37", "parent": "34", "text": "Hi 2", "type": "FDR", "value": "5" }

but I get this instead:

Result

what am I doing wrong??

[WebMethod]
public static Array getChildren(string libraryID)
{
    SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString);
    con.Open();

    //Build root
    string[] documentArray = null;
    List<string> documentList = new List<string>();

    string getUserInfo = "select LibraryName from Document_Library_Names where Id =" + libraryID;
    SqlCommand getUserInfocmd = new SqlCommand(getUserInfo, con);
    string libraryName = Convert.ToString(getUserInfocmd.ExecuteScalar()).Trim();

    documentList.Add("{ \"id\": \"" + libraryName + "\", \"parent\": \"#\", \"text\": \"" + libraryName + "\", \"type\": \"FDR\", \"value\": \"0\" }");

    //Getting documents
    string strGetDocuments = "Select * from Documents where LID =" + libraryID + "  order by DisplayOrder ASC";
    SqlCommand getDocumentsCMD = new SqlCommand(strGetDocuments, con);
    getDocumentsCMD.ExecuteNonQuery();

    DataTable dt = new DataTable();
    SqlDataReader sqlDR = getDocumentsCMD.ExecuteReader();
    dt.Load(sqlDR);
    sqlDR.Close();

    if (dt != null)
    {
        if (dt.Rows.Count > 0)
        {
            //Build the string
            foreach (DataRow row in dt.Rows)
            {
                //Getting the data
                string ID = row[0].ToString().Trim();
                string type = row[2].ToString().Trim();
                string name = row[3].ToString().Trim();
                string parentFolder = row[4].ToString().Trim();
                string displayOrder = row[5].ToString().Trim();
                string extension = row[8].ToString().Trim();

                //Get parentFolder ID
                string parentFolderID = "0";
                if (parentFolder != "")
                {
                    string strParentFolderID = "Select ID from Documents where Name=@Name and Type=0";
                    SqlCommand strParentFolderIDcmd = new SqlCommand(strParentFolderID, con);
                    strParentFolderIDcmd.Parameters.AddWithValue("@Name", parentFolder);
                    parentFolderID = Convert.ToString(strParentFolderIDcmd.ExecuteScalar());
                }
                else
                {
                    parentFolderID = libraryName;
                }
                documentList.Add(" { \"id\": \"" + ID + "\", \"parent\": \"" + parentFolderID + "\", \"text\": \"" + name + "\", \"type\": \"" + extension + "\", \"value\": \"" + displayOrder + "\" }");
                documentArray = documentList.ToArray();
            }
            con.Close();
            //documentList = documentList + "]";
            return documentArray;
        }
        else
        {
            con.Close();
            return documentArray;
        }
    }
    else
    {
        con.Close();
        return documentArray;
    }
}

Javascript:

<script src="Scripts/jquery-3.6.1.js"></script>
<script src="Scripts/jstree.js"></script>
<link href="Scripts/themes/default/style.css" rel="stylesheet" />
    <div id="libraryTreeview">

    </div>

    <script type="text/javascript">
    
        const queryString = window.location.search;
        const urlParams = new URLSearchParams(queryString);
        const libraryID = urlParams.get('ID');
    
        $('#libraryTreeview').jstree({
            "core": {
                "data": {
                        type: "POST",
                        url: "LibraryFiles.aspx/getChildren",
                        data: '{"libraryID":"' + libraryID + '"}',
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: function (results) {
                            results.d;
                            alert(results.d);
                        },
                },
                "themes": {
                    dots: false,
                    "variant": "large",
                    "responsive": true
                },
        });
    </script>

I originally tried with 1 big long string but JSTree didn't like anything after the first folders ending "}" so I had to move to an Array.