Can i have 2 function in one script in html?












0















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.










share|improve this question

























  • 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
















0















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.










share|improve this question

























  • 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














0












0








0


0






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.










share|improve this question
















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






share|improve this question















share|improve this question













share|improve this question




share|improve this question








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



















  • 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












2 Answers
2






active

oldest

votes


















0














Yes, you can! You may add as many as you need, but be careful as it slows load time.






share|improve this answer
























  • 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



















0














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);





share|improve this answer
























  • Do you want onload many functions?

    – kaluogh
    Nov 22 '18 at 6:15












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
});


}
});














draft saved

draft discarded


















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









0














Yes, you can! You may add as many as you need, but be careful as it slows load time.






share|improve this answer
























  • 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
















0














Yes, you can! You may add as many as you need, but be careful as it slows load time.






share|improve this answer
























  • 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














0












0








0







Yes, you can! You may add as many as you need, but be careful as it slows load time.






share|improve this answer













Yes, you can! You may add as many as you need, but be careful as it slows load time.







share|improve this answer












share|improve this answer



share|improve this answer










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



















  • 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













0














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);





share|improve this answer
























  • Do you want onload many functions?

    – kaluogh
    Nov 22 '18 at 6:15
















0














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);





share|improve this answer
























  • Do you want onload many functions?

    – kaluogh
    Nov 22 '18 at 6:15














0












0








0







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);





share|improve this answer













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);






share|improve this answer












share|improve this answer



share|improve this answer










answered Nov 22 '18 at 6:14









kaluoghkaluogh

344




344













  • 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





Do you want onload many functions?

– kaluogh
Nov 22 '18 at 6:15


















draft saved

draft discarded




















































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.




draft saved


draft discarded














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





















































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







Popular posts from this blog

How to change which sound is reproduced for terminal bell?

Title Spacing in Bjornstrup Chapter, Removing Chapter Number From Contents

Can I use Tabulator js library in my java Spring + Thymeleaf project?