Calling multiple JavaScript functions on a button click

Question

How to call multiple functions on button click event?

Here is my button,

Answer 1

And of course you can never call the two functions at the same time. Not any one in the world except you are working on two processors simultaneously.

The best way is to call a JavaScript parent function and in that, specify all the sequence of function you want to call. For example,

function ShowDiv1() {
    document.getElementById("ReportDiv").style.display = 'block';
    return false;
}

function validateView()
{
    if (document.getElementById("ctl00_ContentPlaceHolder1_DLCategory").selectedIndex == 0) {
        document.getElementById("ctl00_ContentPlaceHolder1_ErrorMsg").innerHTML = "Please Select Your Category";
        document.getElementById("ctl00_ContentPlaceHolder1_DLCategory").focus();
        return false;
    }
    if (document.getElementById("ctl00_ContentPlaceHolder1_DLEmpName").selectedIndex == 0) {
        document.getElementById("ctl00_ContentPlaceHolder1_ErrorMsg").innerHTML = "Please Select Your Employee Name";
        document.getElementById("ctl00_ContentPlaceHolder1_DLEmpName").focus();
        return false;
    }
    ShowDiv1();
    return true;
}

Answer 2

That's because, it gets returned after validateView();;

Use this:

OnClientClick="var ret = validateView();ShowDiv1(); return ret;"

Answer 3

Because you're returning from the first method call, the second doesn't execute.

Try something like

OnClientClick="var b = validateView();ShowDiv1(); return b"

or reverse the situation,

OnClientClick="ShowDiv1();return validateView();"

or if there is a dependency of div1 on the validation routine.

OnClientClick="var b = validateView(); if (b) ShowDiv1(); return b"

What might be best is to encapsulate multiple inline statements into a mini function like so, to simplify the call:

// change logic to suit taste
function clicked()  {
    var b = validateView(); 
    if (b) 
        ShowDiv1()
    return b;
}

and then

OnClientClick="return clicked();"

Answer 4

Try this .... I got it... onClientClick="var b=validateView();if(b) var b=ShowDiv1();return b;"

Answer 5

if there are more than 2 js function then following two ways can also be implemented:

1. if you have more than two functions you can group them in if condition

   OR

2. you can write two different if conditions.

1 OnClientClick="var b = validateView(); if (b) ShowDiv1(); if(b) testfunction(); return b">

OR

2 OnClientClick="var b = validateView(); if(b) {

ShowDiv1();

testfunction();

} return b">