JavaScript Function Switch Function Not Working

Question

I recently posted a question and suggested this as an answer but it is not working. Why ?

<div class="text-center">           
    <embed src="https://www.setasign.com/files/demo-files/pdfs/lenstown/Fact-Sheet.pdf" width="300" height="300" type='application/pdf' id="thePdf">
</div>

<div class="button">
    <button class="btn-info" type="button" onclick="switchPdf();">Search</button>
</div>

<script>
function switchPdf() {
    var fileA = 'https://www.setasign.com/files/demo-files/pdfs/lenstown/Fact-Sheet.pdf',
        fileB = 'https://www.setasign.com/files/demo-files/pdfs/tektown/Fact-Sheet.pdf',
        elem = document.getElementById('thePdf');

    elem.src = elem.src == fileA ? fileB : fileA;
}
</script>

Basically there is a default PDF which loads on page open, and once I click the button I want the pdf to change to the other pdf. But it is not working

Check the value of `elem.src` and compare it with other variables... I doubt you will get identical value... — Rayon, Aug 20 '16 at 18:02
What do you mean by "not working"? The code should be switching the src attribute just fine, yet the content might not be loading due to the cross-origin policies. Do you have any error messages in the dev console? — Szab, Aug 20 '16 at 18:17
Possible duplicate of [JavaScript: Changing src-attribute of a embed-tag](http://stackoverflow.com/questions/2493706/javascript-changing-src-attribute-of-a-embed-tag) — WhiteHat, Aug 20 '16 at 18:27

score 0 · Accepted Answer · answered Aug 20 '16 at 18:22

changes to src attribute on <embed>, <object>, etc...
do not take affect

have to replace with a new element

function switchPdf() {
    var fileA = 'https://www.setasign.com/files/demo-files/pdfs/lenstown/Fact-Sheet.pdf',
        fileB = 'https://www.setasign.com/files/demo-files/pdfs/tektown/Fact-Sheet.pdf',
        container = document.getElementById('thePdfContainer'),
        elem = document.getElementById('thePdf');

    var newFile = (elem.src === fileA) ? fileB : fileA;
  
    container.innerHTML = '<embed src="' + newFile + '" width="300" height="300" type="application/pdf" id="thePdf">';

    console.log(container.innerHTML);
}

<div id="thePdfContainer" class="text-center">           
    <embed src="https://www.setasign.com/files/demo-files/pdfs/lenstown/Fact-Sheet.pdf" width="300" height="300" type='application/pdf' id="thePdf">
</div>

<div class="button">
    <button class="btn-info" type="button" onclick="switchPdf();">Search</button>
</div>

That helped big time and thank you for explaining it, super cool :) really appreciate it ! — arjwolf, Aug 20 '16 at 18:47

JavaScript Function Switch Function Not Working

1 Answers1