0

The following code loads JSON data into Tabulator when a button is clicked. How do I get rid of the button logic and trigger the setData function when the page loads?


<!DOCTYPE html>
<html lang="en">
    <head>
        <link href="https://unpkg.com/tabulator-tables/dist/css/tabulator.min.css" rel="stylesheet">
        <script type="text/javascript" src="https://unpkg.com/tabulator-tables/dist/js/tabulator.min.js"></script>
    </head>
    <body>
        <div>
            <button id="ajax-trigger">Load Data via AJAX</button>
        </div>
        <div id="example-table"></div>
        <script type="text/javascript">
            var table = new Tabulator("#example-table", {
                    columns:[
                        {title:"playerName", field:"playerName"},
                        {title:"siVenue", field:"siVenue"},
                        {title:"hrValue", field:"hrValue"},
                        {title:"xbhValue", field:"xbhValue"},
                        {title:"baseValue", field:"baseValue"},
                    ],
            });
            
            document.getElementById("ajax-trigger").addEventListener("click", function(){
                table.setData("https://example.com/getData.php");
            });
            
        </script>
    </body>
</html>
aawige
  • 1
  • 2
  • 1
    Does this answer your question? [window.onload vs document.onload](https://stackoverflow.com/questions/588040/window-onload-vs-document-onload) – evolutionxbox Jan 04 '21 at 20:24
  • 3
    Please use the search function or your preferred search engine to ensure that your question hasn't been asked before. This question is a duplicate of [How to run a function when the page is loaded?](https://stackoverflow.com/questions/4842590/how-to-run-a-function-when-the-page-is-loaded); voting to close as such. – esqew Jan 04 '21 at 20:24
  • Yes, thank you. I changed to window.addEventListener("load", function(){}) and it works. – aawige Jan 04 '21 at 20:27

0 Answers0