How to execute a js function onload?
Question
Below is a fully functional and working code . When I copy paste it to a text file testFile.html and then open it with a browser it works fine.
But I want the selectCollege function to execute right after the initViz function
I tried this
<body onload="initViz();selectCollege('Engineering');"> . . .
But it didn't work. How can I make the selectCollege function to execute right after the initViz ?
<!DOCTYPE html>
<html>
<head>
<title>Select Marks</title>
<script type="text/javascript"
src="https://public.tableau.com/javascripts/api/tableau-2.min.js"></script>
<script type="text/javascript">
var viz, sheet;
function initViz() {
var containerDiv = document.getElementById("vizContainer"),
url = "http://public.tableau.com/views/RegionalSampleWorkbook/College",
options = {
"Academic Year": "",
hideTabs: true,
onFirstInteractive: function () {
sheet = viz.getWorkbook().getActiveSheet();
}
};
viz = new tableau.Viz(containerDiv, url, options);
}
function selectCollege(college_name) {
sheet.selectMarksAsync("College", college_name, tableau.SelectionUpdateType.REPLACE);
}
</script>
</head>
<body onload="initViz();">
<div id="vizContainer"></div>
<br />
<button onclick="selectCollege('Engineering');">Select a value</button>
</body>
</html>
5 answers
solution1
3 2017-08-21 01:00:30
Create a new function
function init(){
initViz();
selectCollege('Engineering');
}
Then call the init function
window.onload = init;
solution2
2 2017-08-21 01:06:53
function initViz(college_name) { //your code viz = new tableau.Viz(containerDiv, url, options); //then selectCollege('engineering'); } function selectCollege(college_name) { sheet.selectMarksAsync("College", college_name, tableau.SelectionUpdateType.REPLACE); }
Use it like this
solution3
2 2017-08-21 01:19:54
This works for me
function bar() { alert("bar"); } function foo() { alert("foo"); }
<!DOCTYPE html> <html> <body onload="bar();foo();"> </body> </html>
solution4
2 ACCPTED 2017-08-21 01:49:48
In selectCollege() you are attempting to access sheet before it is defined in the callback function from the tableau.Viz options object, namely onFirstInteractive() . In order to solve this, you can call the function after defining sheet in that function:
options = {
...
onFirstInteractive: function () {
sheet = viz.getWorkbook().getActiveSheet();
selectCollege('Engineering');
}
};
And according to this forum , onFirstInteractive() will be called once when your instance of tableau.Viz is first rendered.
solution5
0 2017-08-21 01:32:25
...
<body>
... All other tags..
<script>
//just before closing body
function(){
}()
</script>
</body>
....
Call your function just before closing body within a script tag.
HTML tree interpreted sequentially. So that's how I add loading message for SPAs.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.