[2 days left] What’s wrong with your cloud strategy? Learn why multicloud solutions matter with Nimble Storage.Register Now

x
?
Solved

Problems changing the SRC parameter of an embedded PDF Object

Posted on 2004-10-28
7
Medium Priority
?
1,063 Views
Last Modified: 2012-08-14
I have the following code, that when you click on the first (or 3rd) link, the PDF object properly loads a PDF file.  But if you try to change the SRC parameter to load another PDF file, either with or without clearing the SRC parameter first, then the page hangs and won't load the second file.  I just need this to be able to change the src of the pdf object programatically.  Also, please don't suggest the use of Frames or IFrames - I can't use them in my requirements.

Here's the problematic source code:
------------------------------------------------------------------------
1. <span style="text-decoration:underline; cursor:hand;" onClick="pdfObject.src='http://www.adobe.com/products/acrobat/pdfs/acrobat6matrix.pdf';">Load PDF File A</span><br>
2. <span style="text-decoration:underline; cursor:hand;" onClick="pdfObject.src='';">Clear PDF Src Param</span><br>
3. <span style="text-decoration:underline; cursor:hand;" onClick="pdfObject.src='http://www.adobe.com/products/creativesuite/pdfs/creativesuite_faq.pdf';">Load PDF File B</span><br>
<object id="pdfObject" height="500" width="400" align="top" classid="clsid:CA8A9780-280D-11CF-A24D-444553540000">
<param name="setShowToolBar" value="false">
<param name="SRC" value="">
</object>
0
Comment
Question by:bmccleary
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
7 Comments
 
LVL 3

Expert Comment

by:Daedalus05
ID: 12449069
Using Javascript and GET requests, you can handle this as follows:
To load no PDF, use the URL http://yourdomain.com/pdfpage.html
To load PDF A, use the URL http://yourdomain.com/pdfpage.html?pdf=A
To load PDF B, use the URL http://yourdomain.com/pdfpage.html?pdf=B
etc.

Then you would write a JavaScript such that when the page loads, it checks for the GET string, validates the value of pdf as either A or B (or any other valid value), and fills the pdfObject.src parameter as necessary.

An example might be as follows:

<script type="text/javascript">
<!-- (hide from incompatible browsers)
 // These are strings for dynamically writing all but the source URL for the PDF Object
 var objString1 = "<object id=\"pdfObject\" height=500 width=400 align=\"top\" "+
  "classid=\"clsid:CA8A9780-280D-11CF-A24D-444553540000\">\n"+
  "<param name=\"setShowToolBar\" value=\"false\">"+
  "<param name=\"SRC\" value=\"";
 var objString2 = "\">\n</object>";

 // Find the start of the get request
 var startOfGet = document.location.toString().indexOf("?");

 // The GET string is everything AFTER the ?, with multiple vars separated by ampersands
 // we store this as an array using split()
 var getRequest = document.location.toString().substring(startOfGet + 1).split("&");

 // For each GET var, we only check here for one that contains "pdf="
 for(var i = 0; i < getRequest.length; i++)
  if(getRequest[i].indexOf("pdf=")) {
   /* Assuming the length of the value for the pdf variable is only going to be one letter (A or B)
    * we here take the single letter value for pdf as the character following "pdf=";
   var pdfVal = getRequest[i].substring(getRequest[i].indexOf("pdf=") + 4, 1);
   if(pdfVal == "A" || pdfVal == "a")
    document.write(objString1+"http://www.adobe.com/products/acrobat/pdfs/acrobat6matrix.pdf"+objString2);
   else if(pdfVal == "B" || pdfVal == "b")
    document.write(objString1+"http://www.adobe.com/products/creativesuite/pdfs/creativesuite_faq.pdf"+objString2);
  }
//-->
</script>

Place this script where the <object> is currently located, instead of the entire <object> section.
0
 
LVL 3

Expert Comment

by:Daedalus05
ID: 12449120
Also, if you have server-side scripting that might work better than client-side. If so, what flavor?
0
 

Author Comment

by:bmccleary
ID: 12449122
Daedalus05,
Thanks for the great response, and that makes a lot of sense, but I have one problem.  Imagine that my page has a bunch of content "around" the pdf file that I don't want to have reloaded everytime the user switches pdf files.  I want the content around the page to stay loaded without a page refresh, but still be able to change the source of the acrobat object in the page to load a new pdf file.  This would be easy with frames, but I can't use frames in my application.  Any thoughts?
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 

Author Comment

by:bmccleary
ID: 12449161
By the way, we are doing this in .NET, but the problem is not with the server side code, it's again that I want the PDF source to change without a post-back (which takes considerable time due to the other information on the page).
0
 
LVL 3

Accepted Solution

by:
Daedalus05 earned 2000 total points
ID: 12450581
I have tested the following and it works perfectly. You'll have to move things around to fit with your website, but it should work for you. Notice the encapsulating <div> tag contains the PDF object. Using its innerHTML property I clear the div completely and write a completely new object tag. Also, I have created a CSS class for the display of the links.

<html>
<head>
<style type="text/css">
 /* This is to replace the identical styles for the three span pseudo-links */
 .pdflink { text-decoration: underline; cursor:hand }
</style>

<script type="text/javascript">
<!-- (hide from incompatible browsers)
 // These are strings for dynamically writing all but the source URL for the PDF Object
 var objString1 = "<object id=\"pdfObject\" height=500 width=400 align=\"top\" "+
  "classid=\"clsid:CA8A9780-280D-11CF-A24D-444553540000\">\n"+
  "<param name=\"setShowToolBar\" value=\"false\">"+
  "<param name=\"SRC\" value=\"";
 var objString2 = "\">\n</object>";

 function changePDF(pdfID) {
  document.getElementById("pdfSection").innerHTML = "";
  switch(pdfID) {
   case 0: break; /* To simply clear the PDF object */
   case 1: document.getElementById('pdfSection').innerHTML = objString1+"http://www.adobe.com/products/acrobat/pdfs/acrobat6matrix.pdf"+objString2; alert(pdfObject.src); break;
   case 2: document.getElementById('pdfSection').innerHTML = objString1+"http://www.adobe.com/products/creativesuite/pdfs/creativesuite_faq.pdf"+objString2; alert(pdfObject.src); break;
   /* Additional PDF Files can be specified here, with other unique pdfIDs */
   default: alert("Invalid PDF Specified"); break;
  }
 }
//-->
</script>
</head>
<body>
Content Preceding PDF and Links
1. <span class="pdflink" onClick="changePDF(1);">Load PDF File A</span><br>
2. <span class="pdflink" onClick="changePDF(0);">Clear PDF Src Param</span><br>
3. <span class="pdflink" onClick="changePDF(2);">Load PDF File B</span><br>
<div id="pdfSection" style="height: 500; width: 400;">
<object id="pdfObject" height="500" width="400" align="top" classid="clsid:CA8A9780-280D-11CF-A24D-444553540000">
<param name="setShowToolBar" value="false">
<param name="SRC" value="">
</object>
</div>
Content Following PDF and Links
</body>
</html>
0
 
LVL 3

Expert Comment

by:Daedalus05
ID: 12450587
You could also modify the function call as follows:

onClick="changePDF('http://www.adobe.com/products/acrobat/pdfs/acrobat6matrix.pdf');"

and the function would then be:

function changePDF(pdfURL) {
 document.getElementById("pdfSection").innerHTML = "";
 document.getElementByID("pdfSection").innerHTML = objString1 + pdfURL + objString2;
}
0
 

Author Comment

by:bmccleary
ID: 12453054
Fantastic!  Thanks Daedalus05, that worked perfectly.  I really appreciate your help.  It's such a simple solution, but I was tearing out my hair trying to figure it out.  On a side note, do you know any of the other parameters, like setShowToolbar, that I can use to customize the look of the PDF object, or where I can look to find them?  Please let me know!
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

656 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question