-2

I am trying to get a JavaScript function to fire off whenever you try to change the page, and by page I mean change the object. However the object has the JavaScript function within it. I tried the http://www.w3schools.com/jsref/event_onunload.asp event but because the validation needs to take place inside of the object it does not work.

The object "one" has a validation function called "validate" and I am trying to load it on unload so it fires off when I click on another page with the navigation menu. The purpose of this is to validate before the page changes so if the user has any unsaved changes it warns them that they have unsaved changes and asks if they wish to continue. The navigation menu changes the data for the object.

JS Function to populate Object:

function updateObjectFrame(which){
    document.getElementById('one').innerHTML = '<'+'object id="foo" style="height:100%;width:100%;" name="foo" type="text/html" data="'+which.href+'"><\/object>';
    var elements = document.getElementsByClassName('button');
    for ( var i = 0; i < elements.length; ++i ) {
         var element = elements[i];
         element.style.background = '#F0E68C'
         element.style.color = 'black';
    }
    which.style.background = '#333';
    which.style.color = '#fff';
}

The object thats being manipulated:

<div id="one" style="height:100%;width:100%;">
    <object id="foo" name="foo" type="text/html" style="height:100%;width:100%;" data="">
    </object>
</div>

The navigation menu:

<div id="menu">
    <ul>
        <li>
            <a class="button" style="background:#333;color:#fff" href="test.asp?var1=1" onclick="updateObjectFrame(this); return false;">Test1</a>
        </li>
        <li>
            <a class="button" style="background:#333;color:#fff" href="test2.asp?var2=2" onclick="updateObjectFrame(this); return false;">Test2</a>
        </li>
        <li>
            <a class="button" style="background:#333;color:#fff" href="test3.asp?var3=3" onclick="updateObjectFrame(this); return false;">Test3</a>
        </li>
    </ul>
</div>          

If anyone has any suggestions it would be greatly appreciated.

5
  • You should look at w3schools.com/jsref/event_onunload.asp functionality for running code when you leave a page. May 8, 2014 at 11:46
  • The issue is the page never fires the unload event. the problem is that the event never gets to fire off because of the object gets replaced thus the function gets killed. May 8, 2014 at 11:55
  • 2
    @Swippen MDN's unload event documentation is better. Don't even get me started on how bad that W3Schools page is.
    – Scimonster
    May 8, 2014 at 11:56
  • create a fiddle and show what you've tried
    – Hawk
    May 8, 2014 at 11:57
  • Hehe point taken :) just needed some fast reference to the function. I will better myself. May 8, 2014 at 11:58

1 Answer 1

0

try the tag onunload="javascript:function(); for the Body tag

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.