html5 - Displaying PDF file in the object tag -
i need display pdf file in spa application built using durandal framework. i'm leveraging "attr" knockout data-binding provide url of pdf file @ run-time.
<object data-bind="attr: { data: documenturl() }" type="application/pdf" style="width: 100%; height: 100%"></object>
the emitted html displays tag correctly,
<object data="http://127.0.0.1:10000/devstoreaccount1/documents/tradeoverview.pdf" type="application/pdf" style="width: 100%; height: 100%; margin-right: 0px; margin-left: 0px; display: block; opacity: 1;" data-bind="attr: { data: documenturl() }" data-view="durandal/../../templates/tnc/tncdetails" data-active-view="true"></object>
however, pdf file not displayed in browser! when run above emitted html in sample html file, works. not sure why not getting displayed through main app. pointers?
thanks.
this because browser inconsistently handle dynamic <object> tags, , times such tags implemented activex controls don't listen changes object tag.
2 options pursue:
use iframe , point pdf. cause browser handle pdf natively (for example, chrome displays pdfs using own engine, firefox displays pdf using javascript library, ie uses activex...).
rather data-binding object tag, if pdf changes, remove object tag , write new 1 in place. browsers pick changes dom fine.
Comments
Post a Comment