Editable JavaScript TreeGrid with Gantt chart and SpreadSheet

TreeGrid with Gantt chart and SpreadSheet and Extended API component core

It is fully working trial version. There is no expiration date for the trial version.
All the TreeGrid required redistributable files are located in /Grid/ directory, see their description.
There is also bundled package file GridEStandalone.js that can be used standalone without any other required files.
The trial version may be used only for evaluation or testing purposes.

Local examples

(of all three components TreeGrid, Gantt chart and SpreadSheet)
Complex examples demonstrating many features at once.
These examples use static JSON files as data sources, without any server script and without saving changes back to the data.
There are also XML versions (on right side of the links) that use XML files as data sources.
There are also three complex examples in RTL (right to left) mode: FirstRtl, SheetRtl, and GanttRtl.

Local tutorial examples

(of all three components TreeGrid, Gantt chart and SpreadSheet)
Simple examples demonstrating particular feature.
These examples use static JSON files as data sources, without any server script and without saving changes back to the data.
There are also XML versions (on right side of the links) that use XML files as data sources.

Framework examples

(of all three components TreeGrid, Gantt chart and SpreadSheet)
Simple examples demonstrating TreeGrid usage with famous JavaScript frameworks.
There are six similar example sets for Angular, React, Vue, Ember, Express and Svelte frameworks.
There is also one universal Html example for other JavaScript frameworks.
These examples show also communication with NodeJS server and SQL database or JSON file.
The sample scripts can be used as framework of your application.
There are also special examples to use TreeGrid in SalesForce in Lightning Web Component (LWC).

Server examples

(of all three components TreeGrid, Gantt chart and SpreadSheet)
Simple examples demonstrating communication with server.
There are four similar example sets for ASP.NET (C#, VB), PHP and JSP (JAVA).
These examples show various ways of loading data from and saving data back to SQL database or XML file.
The sample server scripts can be used as framework of your application.

PDF export examples

(of all three components TreeGrid, Gantt chart and SpreadSheet)
Simple examples demonstrating printing to PDF feature.
The examples demonstrate communication with server and using headless Chrome for HTML to PDF conversion.
There are four similar example sets for ASP.NET (C#, VB), PHP and JSP (JAVA).
The sample server scripts can be used as framework for your printing to PDF.

Documentation

(for all three components TreeGrid, Gantt chart and SpreadSheet)
Full offline documentation in HTML, with content tree, search and glossary.

Installation

No installation is required, just unzip the whole package to some directory and run the Index.html from the http web server.
Notes for individual http servers to better set up the TreeGrid examples are listed below.

Only the Framework examples require usual installation via NodeJS, see the installation procedure in individual framework example: Node server, Angular examples, React examples, Vue examples, Ember examples, Express examples, Svelte examples, Other frameworks examples.
The SalesForce LWC examples require installation on SalesForce org: SalesForce LWC.

Basic requirements

To test examples properly you should preserve the default directory structure in the whole package.
To run the Server & PDF examples your http server must have installed appropriate server script environment (ASP.NET/PHP/JSP).
To run the Frameworks examples see the description for the individual example how to install and run them.
You need to permit appropriate read and write rights to all data files in this distribution.
For all XML files must be read access and for database files like MDB or TXT files must be read and write access.
These rights must be granted to all users (or to appropriate server script processor), even if you are system administrator.
All examples use files from /Grid/ directory directly from browser. This url is accessed relatively, usually as ../../../Grid/.
Therefore this path must be accessible for browser on actual web server.
It means you must create http virtual folder from this package root directory and not from any nested one like /Examples.

Without web server

Tutorials and Local examples use JSONP format and can be executed locally on local computer directly from file system, just in browser from disk.
Click on any sample html file to run it from disk on file:// protocol. Only Excel and Gantt CSV examples cannot be run locally.
In some IE on Windows you have to confirm JavaScript execution if you browse html locally from file system, fortunately, when running it remotely (even on local or remote server), it is not needed.
If you are not system administrator, you must, especially on Linux systems, permit read rights to all JS files in this package.

Windows IIS

Create new virtual IIS web folder from TreeGrid distribution or copy it to existing virtual folder. In this case, this file will be accessible from http://localhost/virtual_folder/Index.html.
If you are not familiar with IIS, you can copy it to your default IIS root usually located at c:/inetpub/wwwroot/, for example to c:/inetpub/wwwroot/treegrid/ and in this case this file will be accessible from http://localhost/treegrid/Index.html.
Of course, instead of localhost you can use any remote server and use its IP address or URL to access TreeGrid examples.

Visual Studio .NET

Open the TreeGrid_VSNET.sln solution file in the package root directory in Visual Studio.
In Solution Explorer (Ctrl+Alt+L) expand the package directory and set the Index.html as Start page (from popup menu).
Run this package index on VS.NET temporary web server in IE by F5.

ASP.NET MVC 3, 4 or 5 + Visual Studio .NET

Create new MVC project in Visual Studio (MVC3, MVC4 or MVC5).
If the project is empty, create new Controller and new View for that controller.
Copy /Grid directory from this package root to the root of the MVC project (where are directories like Views and Controllers).
Copy sample XML data to MVC project, e.g. copy /Examples/Html/BasicAjax/FirstDef.xml and FirstData.xml to the /Models.
Add TreeGrid script to the View .cshtml file <head> as
<script src="Grid/GridE.js"> </script> Add TreeGrid to the View .cshtml file, .e.g. add this code for the First example data in Models: <div style="width:100%;height:500px;">
   <bdo Layout_Url="Models/FirstDef.xml" Data_Url="Models/FirstData.xml"></bdo>
</div> Run the project controller with the view in browser by F5. Optionally add the Controller name to the url shown in browser.
Note, you should run the TreeGrid examples and tutorials in VS.NET without MVC first to learn TreeGrid basic concepts.

SharePoint + Visual Studio .NET

Copy the whole package to wpresources directory.
This directory is located by default at c:\inetpub\wwwroot\wss\VirtualDirectories\80\wpresources
In Visual Studio create new Project as C#/VB -> SharePoint -> 2010 or 2007 -> Visual Web Part.
Add such simple lines to the .ascx page to the end after the <%@ ... %> directives :
<script src="/wpresources/Grid/GridE.js"> </script>
<div style="width:900px;height:400px;">
   <bdo Sync="1" Layout_Url="/wpresources/Examples/Html/BasicAjax/FirstDef.xml"
      Data_Url="/wpresources/Examples/Html/BasicAjax/FirstData.xml"></bdo>
</div>
Run VS.NET debugger. Or just build and deploy the component and go to the SharePoint web page.
Edit the web page and add the Custom Web Part to some location, save, refresh and the grid will be displayed in SharePoint. Note, you should run the TreeGrid examples and tutorials in VS.NET without SharePoint first to learn TreeGrid basic concepts.

Linux Apache

Copy the whole TreeGrid distribution to some subdirectory of the Apache DocumentRoot.
Or create linux symbolic link in DocumentRoot to TreeGrid distribution. In the DocumentRoot (or in its subdirectory) must be permitted Option FollowSymLinks.
Or create Alias to the TreeGrid distribution in httpd.conf file (usually in section module mod_alias), followed by settings of directory rights.
For example writing to httpd.conf these two lines creates alias "http://localhost/treegrid/" to treegrid located at "/opt/TreeGrid/": Alias /treegrid /opt/TreeGrid/
<Directory /opt/TreeGrid>Allow from all</Directory>
After any change in httpd.conf file you must restart Apache by calling "httpd -k restart"
On Linux are urls case sensitive, therefore you must use exact spelling, this package files have the first letter upper case.
Of course, instead of localhost you can use any remote server and use its IP address or URL to access TreeGrid examples.

Apache Tomcat

Copy the whole TreeGrid distribution to some subdirectory in the Apache Tomcat /webapps/ROOT/.
Or copy the whole TreeGrid distribution to some directory on your disk and create virtual Tomcat directory.
For example copy the distribution to c:\treegrid and to Tomcat /conf/server.xml to <Host> add tag:
<Context path="/treegrid" docBase="c:\treegrid" crossContext="false" reloadable="true" />
and run it from http://localhost/treegrid/Index.html