LIMITED-TIME FREE OFFER

In order to build our reputation, we are offering our powerful data grid for free for a limited time. You're still bound by each technology's EULA where applicable. All we're asking for in exchange is an honest review, good or bad. Please email our Tech Lead for help or to leave a review. You can also use the Contact Us form to communicate with us.

* I agree to the EULA

Choose the archive format you want to download for Angular or React:
.zip .tar .tar.gz

Read EULA

To initialize the grid, apply the short piece of code after the enterprise js file reference in your project's appropriate javascript or html file in a script tag. You simply need to replace the data variable assignment with your own list of data you want to display:


                                <!-- where data is an array of objects e.g. [ { name: "dave" }, {name: "amy" } ] -->


                                var data = [ { name: "Dave", salary: 80000, title: "CEO" }, {name: "Amy", salary: 75000, title: "CIO" }, 
                                {name: "Ted", salary: 60000, title: "QA Engineer" }, {name: "Sarah", salary: 75000, title: "Engineer" } ];

                                deebo.methods.setLoading()//add an overlay while your backend api is responding

                                data = deebo.methods.convertNeededCols(data)

                                dataTableService.methods.mainData = data.filter( function(d) { return true })

                                dataTableService.methods.currFilData = data.filter( function(d) { return true })

                                dataTableService.methods.mainDataLen = dataTableService.methods.mainData.length

                                deebo.methods.buildInitUiDataTable(data, "black", "skyblue")//any 2 css colors

                                //deebo.methods.buildInitUiDataTable(data, "black", "skyblue", true)//pass true in 4th arg to block editing

                                //deebo.methods.buildInitUiDataTable(data, "black", "skyblue", true, true)//pass true in 5th arg to hide row numbers

To Add Column Symbols (Numeric Columns)

To add symbols to numeric columns, do a ctrl + F in the newly downloaded/purchased javascript file for columnSymbols: on the downloaded script. Then update the code with the appropriate column names and symbols for your data. You can also create a separate script to update the column symbols since the downloaded script is minified and more difficult to read. To reference the columnSymbols object from your separate script, simply say dataTableService.methods.columnSymbols = [{column: ${yourproperty}, symbol: ${yoursymbol}}].

To Bolster Performance with Web Workers

Download the following javascript web worker file, then place it in the root of your website:

https://d2ffvluimla00s.cloudfront.net/worker.js

This file will boost the performance of the data grid. Do a ctrl + F in the newly downloaded/purchased javascript file for workerUrl: and replace the value "http://127.0.0.1:8080/worker.js" with the new location of the file at your website root e.g. "https://example.com/worker.js". That's all you need to do.