RetroSearch Browse

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://docs.dhtmlx.com/suite/dataview/initialization/ below:

JavaScript DataView - Initialization | DHTMLX Suite 9 Docs

Initialization

To initialize DHTMLX DataView on a page, you need to take the following simple steps:

Include source files
Create a container
Initialize DataView with the object constructor
Load data into DataView

index.html

<!DOCTYPE html>
<html>
    <head>
        <title>How to start with DHTMLX DataView</title>         
        <script type="text/javascript" src="../../codebase/suite.js"></script>
        <link rel="stylesheet" href="../../codebase/suite.css">
    </head>
    <body>
        <div id="dataview_container"></div>
        <script>
            
            const dataview = new dhx.DataView("dataview_container", {
                itemsInRow: 5
            });
        </script>
    </body>
</html>

Include source filesâ

Unpack the downloaded package into a folder of your project.

After that, create an HTML file and place full paths to JS and CSS files of the DHTMLX Suite library into the header of the file. The files are:

suite.js
suite.css

index.html

<script type="text/javascript" src="../../codebase/suite.js"></script>
<link rel="stylesheet" href="../../codebase/suite.css">

Create a containerâ

Add a container for DataView and give it an id, for example "dataview_container":

index.html

<div id="dataview_container"></div>

Initialize DataViewâ

Initialize DataView with the dhx.DataView object constructor. The constructor has two parameters:

the HTML container for DataView,
optional, an object with configuration properties. If this argument is not passed to the constructor, the settings will be default.

index.js


const dataview = new dhx.DataView("dataview_container", {
    itemsInRow: 5
});

info

To display data in DataView you should define a template via the template configuration property.

Another way to display data in DataView is to prepare a data set with the "value" attribute.

Configuration propertiesâ

There is a set of properties you can specify for DataView to optimize its configuration for your needs.

The detailed information on DataView configuration options can be found in the Dataview API overview article.

Load data into DataViewâ

Detailed information on how to load data into DHTMLX DataView is given in the Data loading article.

Exampleâ

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4