Calling multiple javascript functions on a button click.....

Question

How to call multiple functions on button click event?

Here is my button,

<asp:LinkButton ID="LbSearch" runat="server" CssClass="regular" onclick="LbSearch_Click"
OnClientClick="return validateView();ShowDiv1();">

But my ShowDiv1 Doesnt get called....

My javascript functions,

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;
    }
    return true;
}

If ValidateView() function returns true i should call ShowDiv1()...........

Answer 1

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 2

thats because, it gets returned after validateView();;

use this :

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

Answer 3

change OnClientClick="return validateView();ShowDiv1();"> to OnClientClick="javascript: if(validateView()) ShowDiv1();">

Answer 4

It isn't getting called because you have a return statement above it. In the following code:

function test(){
  return 1;
  doStuff();
}

doStuff() will never be called. What I would suggest is writing a wrapper function

function wrapper(){
   if (validateView()){
     showDiv();
     return true;
   }
}

and then call the wrapper function from your onclick handler.

Answer 5

and ofcourse u can never call the two function at the same time...not any one in the world except ur working on two processors simultaneously............

the best way is to call a javascript parent function and in that, specify all the sequence of function u want to call for ...ex:-

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; 

}