Question

What should be done to avoid a server request for the pdf? I have tried visibility=hidden and width=0.

<object class='pdfClass' data='"+conventionId+"/showPdf.html' width='100%' height='600'></object>

function toggleConv() {
    if (...) {
        document.getElementById(conventionId).style.display = 'none';
    } else {
        document.getElementById(conventionId).style.display = ''; //causes a refresh
    }
}

Answer 1

EDIT:

After testing, I found out that the following works in Firefox 13 without reloading:

<object id="test" class='pdfClass' data='https://web3.unt.edu/riskman/PDF/Guidelines_on_Staphylococcal_Infections-Athletics__Revised__06-22-06.pdf' width='100%' height='600'></object>

function toggleConv(o){
    var test = document.getElementById('test');

    if (o == true){
        test.style.width = 0;
        test.style.height = 0;
    } else {
        test.style.width = '100%';
        test.style.height = '600px';
    }
}

http://jsfiddle.net/userdude/KnEYC/2/

---

Original response. Note that the height and width of the element also need to be toggled down to little or nothing to prevent it continuing to taking up the same space.

One technique would be to hide it from view by placing it way off screen:

#test {
    position: relative;
}

function toggleConv(o){
    if (o == true){
        document.getElementById('test').style.left = '-10000px';
        document.getElementById('test').style.top = '-10000px';
    } else {
        document.getElementById('test').style.left = '';
        document.getElementById('test').style.top = '';
    }
}

http://jsfiddle.net/userdude/KnEYC/