How to perform a JavaScript function when this specific onclick event is performed?

Question

I am not so into JavaScript and I have the following problem.

Into a JSP page I have some "links" like this:

<tr onmouseout="Javascript: this.style.background='#EAEFFF'; this.style.color='#003399';" onmouseover="Javascript: this.style.background='#003399'; this.style.color='#FFFFFF'; this.style.cursor='hand';" style="background-color: #EAEFFF;" onclick="Javascript: document.location.href='edi.do?serv=4.1';">
    <td>
        <!--A HREF="edi.do?serv=4.1" class="linkBlue" onMouseOver="self.status='Comunicazioni'; return true"-->
        Comunicazioni
    </td>
</tr>

As you can see in the previous code snippet the link is not yet implemented by a classic a href but, in its place, it is done by JavaScript using this expression:

onclick="Javascript: document.location.href='edi.do?serv=4.1';"

So, correct me if I am saying wrong assertion, I think that (when the user click on the tr ) by the Javascript: it perform the following JavaScript operation that open the link. Is it the correct interpretation?

It works but my problem is that, before doing it, I have to perform a specific loadingPopUp() JavaScript function defined into the

<script type="text/javascript">...</script>

section of my page. So my problem is: how can I perform the loadingPopUp() function before the Javascript: document.location.href='edi.do?serv=4.1'; on the onclick event?

Answer 1

change onclick event to:

onclick="changeLocationTo('edi.do?serv=4.1')"

create a new js function:

function changeLocationTo(newLocation)
{
   loadingPopUp();

   // you may add an timeout here or to handle a popup action like closing it

   document.location.href = newLocation;
}

Answer 2

Yes, Your assertion is absolutely right. But I think if you call your function before changing url then it would not be correct approach because second function will be executed immediately after your loadingpopup function and will redirect user to different page, so I think your purpose of opening popup will not be fulfilled.

So try this

Way 1: if you want to load your popup and immediately redirect user

function fnOpenNewLink(){
    loadingPopUp();
    document.location.href='edi.do?serv=4.1';
}

Way 2: if you want to load your popup and then redirect user according to your requirement.

function fnOpenNewLink(){
    loadingPopUp(function(){
        document.location.href='edi.do?serv=4.1';
    });
}

function loadingPopUp(callback){

    //your stuff

    //when everything is done, just call the callback
    callback();
}