Can i have 2 function in one script in html?
My page has a multiple 'tab' which displaying different data.
Here is my function for tab.
function openEvt(evt, evtName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(evtName).style.display = "block";
evt.currentTarget.className += " active";
}
My page will display a bar chart when user click 'Detail' tab.
This is my code for the chart.
I put it in the script with the function openEvt().
function setChart(){
var ctx = document.getElementById("detail");
var detail= new Chart(ctx, {
type: 'bar',
data: {
labels: {{ chartdata_labels|safe }},
datasets: [{
label: '# of votes',
data: {{ chartdata_data }},
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
}
window.onload = setChart;
Here is my code for display the chart above a table of data.
<canvas id="detail" width="1200" height="400"></canvas>
It work fine when there is only one function-openEvt().
But when I add in the setChart(), the tab wont function and no any data is display.
javascript html
|
show 1 more comment
My page has a multiple 'tab' which displaying different data.
Here is my function for tab.
function openEvt(evt, evtName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(evtName).style.display = "block";
evt.currentTarget.className += " active";
}
My page will display a bar chart when user click 'Detail' tab.
This is my code for the chart.
I put it in the script with the function openEvt().
function setChart(){
var ctx = document.getElementById("detail");
var detail= new Chart(ctx, {
type: 'bar',
data: {
labels: {{ chartdata_labels|safe }},
datasets: [{
label: '# of votes',
data: {{ chartdata_data }},
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
}
window.onload = setChart;
Here is my code for display the chart above a table of data.
<canvas id="detail" width="1200" height="400"></canvas>
It work fine when there is only one function-openEvt().
But when I add in the setChart(), the tab wont function and no any data is display.
javascript html
make sure there are no syntax/logical error in setChart function. Do you have any error in console reported ?. If you can make a jsfiddle, I could help you more.
– sking
Nov 22 '18 at 4:43
No error returned, just can't display any data.
– Evon
Nov 22 '18 at 4:47
1
labels: {{ chartdata_labels|safe }},
are you using any template engine? . If not this is a syntax error.
– sking
Nov 22 '18 at 4:49
I have found it! You use double brackets at data.labels, in JavaScript, we use single for those types, so it has to be single {labels:'whatever'} or into an array [{labels:'whatever'}]. Also, you have to define your text at labels, OR is not a choice.
– DarkHeart Productions
Nov 22 '18 at 4:50
I using django(python) and display it in html.
– Evon
Nov 22 '18 at 4:53
|
show 1 more comment
My page has a multiple 'tab' which displaying different data.
Here is my function for tab.
function openEvt(evt, evtName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(evtName).style.display = "block";
evt.currentTarget.className += " active";
}
My page will display a bar chart when user click 'Detail' tab.
This is my code for the chart.
I put it in the script with the function openEvt().
function setChart(){
var ctx = document.getElementById("detail");
var detail= new Chart(ctx, {
type: 'bar',
data: {
labels: {{ chartdata_labels|safe }},
datasets: [{
label: '# of votes',
data: {{ chartdata_data }},
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
}
window.onload = setChart;
Here is my code for display the chart above a table of data.
<canvas id="detail" width="1200" height="400"></canvas>
It work fine when there is only one function-openEvt().
But when I add in the setChart(), the tab wont function and no any data is display.
javascript html
My page has a multiple 'tab' which displaying different data.
Here is my function for tab.
function openEvt(evt, evtName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(evtName).style.display = "block";
evt.currentTarget.className += " active";
}
My page will display a bar chart when user click 'Detail' tab.
This is my code for the chart.
I put it in the script with the function openEvt().
function setChart(){
var ctx = document.getElementById("detail");
var detail= new Chart(ctx, {
type: 'bar',
data: {
labels: {{ chartdata_labels|safe }},
datasets: [{
label: '# of votes',
data: {{ chartdata_data }},
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
}
window.onload = setChart;
Here is my code for display the chart above a table of data.
<canvas id="detail" width="1200" height="400"></canvas>
It work fine when there is only one function-openEvt().
But when I add in the setChart(), the tab wont function and no any data is display.
javascript html
javascript html
edited Nov 22 '18 at 6:26
jnuK
1,5681526
1,5681526
asked Nov 22 '18 at 4:31
EvonEvon
657
657
make sure there are no syntax/logical error in setChart function. Do you have any error in console reported ?. If you can make a jsfiddle, I could help you more.
– sking
Nov 22 '18 at 4:43
No error returned, just can't display any data.
– Evon
Nov 22 '18 at 4:47
1
labels: {{ chartdata_labels|safe }},
are you using any template engine? . If not this is a syntax error.
– sking
Nov 22 '18 at 4:49
I have found it! You use double brackets at data.labels, in JavaScript, we use single for those types, so it has to be single {labels:'whatever'} or into an array [{labels:'whatever'}]. Also, you have to define your text at labels, OR is not a choice.
– DarkHeart Productions
Nov 22 '18 at 4:50
I using django(python) and display it in html.
– Evon
Nov 22 '18 at 4:53
|
show 1 more comment
make sure there are no syntax/logical error in setChart function. Do you have any error in console reported ?. If you can make a jsfiddle, I could help you more.
– sking
Nov 22 '18 at 4:43
No error returned, just can't display any data.
– Evon
Nov 22 '18 at 4:47
1
labels: {{ chartdata_labels|safe }},
are you using any template engine? . If not this is a syntax error.
– sking
Nov 22 '18 at 4:49
I have found it! You use double brackets at data.labels, in JavaScript, we use single for those types, so it has to be single {labels:'whatever'} or into an array [{labels:'whatever'}]. Also, you have to define your text at labels, OR is not a choice.
– DarkHeart Productions
Nov 22 '18 at 4:50
I using django(python) and display it in html.
– Evon
Nov 22 '18 at 4:53
make sure there are no syntax/logical error in setChart function. Do you have any error in console reported ?. If you can make a jsfiddle, I could help you more.
– sking
Nov 22 '18 at 4:43
make sure there are no syntax/logical error in setChart function. Do you have any error in console reported ?. If you can make a jsfiddle, I could help you more.
– sking
Nov 22 '18 at 4:43
No error returned, just can't display any data.
– Evon
Nov 22 '18 at 4:47
No error returned, just can't display any data.
– Evon
Nov 22 '18 at 4:47
1
1
labels: {{ chartdata_labels|safe }},
are you using any template engine? . If not this is a syntax error.– sking
Nov 22 '18 at 4:49
labels: {{ chartdata_labels|safe }},
are you using any template engine? . If not this is a syntax error.– sking
Nov 22 '18 at 4:49
I have found it! You use double brackets at data.labels, in JavaScript, we use single for those types, so it has to be single {labels:'whatever'} or into an array [{labels:'whatever'}]. Also, you have to define your text at labels, OR is not a choice.
– DarkHeart Productions
Nov 22 '18 at 4:50
I have found it! You use double brackets at data.labels, in JavaScript, we use single for those types, so it has to be single {labels:'whatever'} or into an array [{labels:'whatever'}]. Also, you have to define your text at labels, OR is not a choice.
– DarkHeart Productions
Nov 22 '18 at 4:50
I using django(python) and display it in html.
– Evon
Nov 22 '18 at 4:53
I using django(python) and display it in html.
– Evon
Nov 22 '18 at 4:53
|
show 1 more comment
2 Answers
2
active
oldest
votes
Yes, you can! You may add as many as you need, but be careful as it slows load time.
But why my function doesn't work?
– Evon
Nov 22 '18 at 4:42
which one? I assume the bottom.
– DarkHeart Productions
Nov 22 '18 at 4:44
ya, setChart function. If I have 2 functions in script, both won't work.
– Evon
Nov 22 '18 at 4:49
add a comment |
function SayHello() {
alert('Hello')
}
function SayWorld() {
alert('World')
}
function addWindowOnloadEvent(func) {
var oldWindowOnload = window.onload;
if (typeof func === 'function') {
if (typeof window.onload === 'function') {
window.onload = function () {
oldWindowOnload();
func();
}
} else {
window.onload = func;
}
}
}
addWindowOnloadEvent(SayHello);
addWindowOnloadEvent(SayWorld);
Do you want onload many functions?
– kaluogh
Nov 22 '18 at 6:15
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53423926%2fcan-i-have-2-function-in-one-script-in-html%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
Yes, you can! You may add as many as you need, but be careful as it slows load time.
But why my function doesn't work?
– Evon
Nov 22 '18 at 4:42
which one? I assume the bottom.
– DarkHeart Productions
Nov 22 '18 at 4:44
ya, setChart function. If I have 2 functions in script, both won't work.
– Evon
Nov 22 '18 at 4:49
add a comment |
Yes, you can! You may add as many as you need, but be careful as it slows load time.
But why my function doesn't work?
– Evon
Nov 22 '18 at 4:42
which one? I assume the bottom.
– DarkHeart Productions
Nov 22 '18 at 4:44
ya, setChart function. If I have 2 functions in script, both won't work.
– Evon
Nov 22 '18 at 4:49
add a comment |
Yes, you can! You may add as many as you need, but be careful as it slows load time.
Yes, you can! You may add as many as you need, but be careful as it slows load time.
answered Nov 22 '18 at 4:33
DarkHeart ProductionsDarkHeart Productions
565
565
But why my function doesn't work?
– Evon
Nov 22 '18 at 4:42
which one? I assume the bottom.
– DarkHeart Productions
Nov 22 '18 at 4:44
ya, setChart function. If I have 2 functions in script, both won't work.
– Evon
Nov 22 '18 at 4:49
add a comment |
But why my function doesn't work?
– Evon
Nov 22 '18 at 4:42
which one? I assume the bottom.
– DarkHeart Productions
Nov 22 '18 at 4:44
ya, setChart function. If I have 2 functions in script, both won't work.
– Evon
Nov 22 '18 at 4:49
But why my function doesn't work?
– Evon
Nov 22 '18 at 4:42
But why my function doesn't work?
– Evon
Nov 22 '18 at 4:42
which one? I assume the bottom.
– DarkHeart Productions
Nov 22 '18 at 4:44
which one? I assume the bottom.
– DarkHeart Productions
Nov 22 '18 at 4:44
ya, setChart function. If I have 2 functions in script, both won't work.
– Evon
Nov 22 '18 at 4:49
ya, setChart function. If I have 2 functions in script, both won't work.
– Evon
Nov 22 '18 at 4:49
add a comment |
function SayHello() {
alert('Hello')
}
function SayWorld() {
alert('World')
}
function addWindowOnloadEvent(func) {
var oldWindowOnload = window.onload;
if (typeof func === 'function') {
if (typeof window.onload === 'function') {
window.onload = function () {
oldWindowOnload();
func();
}
} else {
window.onload = func;
}
}
}
addWindowOnloadEvent(SayHello);
addWindowOnloadEvent(SayWorld);
Do you want onload many functions?
– kaluogh
Nov 22 '18 at 6:15
add a comment |
function SayHello() {
alert('Hello')
}
function SayWorld() {
alert('World')
}
function addWindowOnloadEvent(func) {
var oldWindowOnload = window.onload;
if (typeof func === 'function') {
if (typeof window.onload === 'function') {
window.onload = function () {
oldWindowOnload();
func();
}
} else {
window.onload = func;
}
}
}
addWindowOnloadEvent(SayHello);
addWindowOnloadEvent(SayWorld);
Do you want onload many functions?
– kaluogh
Nov 22 '18 at 6:15
add a comment |
function SayHello() {
alert('Hello')
}
function SayWorld() {
alert('World')
}
function addWindowOnloadEvent(func) {
var oldWindowOnload = window.onload;
if (typeof func === 'function') {
if (typeof window.onload === 'function') {
window.onload = function () {
oldWindowOnload();
func();
}
} else {
window.onload = func;
}
}
}
addWindowOnloadEvent(SayHello);
addWindowOnloadEvent(SayWorld);
function SayHello() {
alert('Hello')
}
function SayWorld() {
alert('World')
}
function addWindowOnloadEvent(func) {
var oldWindowOnload = window.onload;
if (typeof func === 'function') {
if (typeof window.onload === 'function') {
window.onload = function () {
oldWindowOnload();
func();
}
} else {
window.onload = func;
}
}
}
addWindowOnloadEvent(SayHello);
addWindowOnloadEvent(SayWorld);
answered Nov 22 '18 at 6:14
kaluoghkaluogh
344
344
Do you want onload many functions?
– kaluogh
Nov 22 '18 at 6:15
add a comment |
Do you want onload many functions?
– kaluogh
Nov 22 '18 at 6:15
Do you want onload many functions?
– kaluogh
Nov 22 '18 at 6:15
Do you want onload many functions?
– kaluogh
Nov 22 '18 at 6:15
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53423926%2fcan-i-have-2-function-in-one-script-in-html%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
make sure there are no syntax/logical error in setChart function. Do you have any error in console reported ?. If you can make a jsfiddle, I could help you more.
– sking
Nov 22 '18 at 4:43
No error returned, just can't display any data.
– Evon
Nov 22 '18 at 4:47
1
labels: {{ chartdata_labels|safe }},
are you using any template engine? . If not this is a syntax error.– sking
Nov 22 '18 at 4:49
I have found it! You use double brackets at data.labels, in JavaScript, we use single for those types, so it has to be single {labels:'whatever'} or into an array [{labels:'whatever'}]. Also, you have to define your text at labels, OR is not a choice.
– DarkHeart Productions
Nov 22 '18 at 4:50
I using django(python) and display it in html.
– Evon
Nov 22 '18 at 4:53