JsonTree.js - Example - Array Paging

This is an example that shows how to use paging to view array items.

Download Now

v4.7.0 - 10th Dec 2024
Code
                                    function bindingOptions() {
                                        return {
                                            paging: {
                                                enabled: true
                                            },
                                            data: [
                                                {
                                                    value1: true,
                                                    value2: "This is a string",
                                                    value3: new Date(),
                                                    value4: 5,
                                                    value7: null,
                                                    value8: function() {
                                                        // Does nothing
                                                    },
                                                    value9: 3.1415926535,
                                                    value10: 9007199254740991n,
                                                    value11: Symbol( "id" ),
                                                    value12: {},
                                                    value13: undefined,
                                                    value14: ( message ) => {
                                                        alert( message );
                                                    },
                                                    value15: "rgb(144, 238, 144)",
                                                    value16: crypto.randomUUID(),
                                                    value5: [
                                                        true,
                                                        "This is another string",
                                                        {
                                                            arrayValue1: true,
                                                            arrayValue2: 10
                                                        },
                                                        [
                                                            false,
                                                            true,
                                                            5,
                                                            10,
                                                            new Date(),
                                                            "#90ee90"
                                                        ]
                                                    ],
                                                    value6: {
                                                        objectValue1: false,
                                                        objectValue2: "This is a new string.",
                                                        objectValue3: 20,
                                                        objectValue4: "This is an example of a very long string that should force scrolling to kick in.",
                                                    }
                                                },
                                                {
                                                    value1: true,
                                                    value2: "This is a string",
                                                    value3: new Date(),
                                                    value4: 5,
                                                    value5: null
                                                }
                                            ]
                                        }
                                    }