0

I am using iframe to display pdf or doc file on the page. pdf without any doubt displayed perfectly but doc file just downloaded and i am aware why.

Now the problem is I want to display a message in iframe that the file was a doc files so cannot be displayed and need to be downloaded to view.

till now I have searched and found various solutions to display a message or anything while loading iframe but I guess here its not the case of loading anything.

here is fiddle

Himanshu Bhandari
  • 1,769
  • 2
  • 23
  • 37

3 Answers3

0

Show some sample code so we can give you best solution. you can use js fiddle as well.

Otherwise you can add if condition to check the check file type and show the alert notification to users.

Harmeet Singh
  • 144
  • 1
  • 8
0

What about you check what file-type it is before you change or set the iframe?

If it is pdf, you display the file in the iframe, if it is doc, you load another html file with the message instead.

Also, as the other guy said, please show some examples of what you have done!

EDIT: Use javascript. Have a look at this code and tell me if it helps http://jsfiddle.net/7803gakc/1/

// Not really sure about another way if it's going to be pure js/html and nothing server-side

// Here's the location to the file
var file = "http://www.ieee.org/documents/ieeecopyrightform.doc",

// The frame being used
    frame = document.getElementById("frame"),

// Files that will be allowed to be embedded based on extension
    extensions = ["pdf"],

// This will tell us if it's right or not
    correct = false;

// Loop through the extension list
for(var i = 0; i < extensions.length; i++){
    // Check if the file url ends with the given extension
    if(file.substring(file.lastIndexOf(".")+1) == extensions[i]){
        // All conditions met, set to true!
        correct = true;
    }
}

if(correct){
    // Yay, it's correct!
    frame.src = file;
}else{
    // It's wrong, show something else!
    frame.src = "http://example.com";
}
Invoku
  • 81
  • 11
  • I don't have file info in advance so it's not possible. – Himanshu Bhandari Apr 23 '15 at 12:34
  • You'll need to provide some code, because I don't really know where to go from here. – Invoku Apr 23 '15 at 12:53
  • 1
    Updated the answer with a new fiddle. Hope it helps! :) – Invoku Apr 23 '15 at 13:49
  • hey thanks for the fiddle and updated answer, but as i said i don't have file info in advance. I am using Liferay which gives me file path as '[path to file]/a4d0ab01-4624-45c3-96d4-9fa857e39029'. so i don't have file extension here. – Himanshu Bhandari Apr 24 '15 at 06:28
  • However by using file MIME type I can do this, as per my search...but that would be a long way for this small task, so i am asking if some other option or tricks are there. – Himanshu Bhandari Apr 24 '15 at 06:30
  • Not sure if you can get mime-type without anything server-side? – Invoku Apr 24 '15 at 09:02
  • Wait, you can do a ajax request, I completely forgot that. I'll make a new example soon! – Invoku Apr 24 '15 at 09:18
  • Yes without server side, I won't get that, and that's why I am not going into that direction either. Well I have found a solution using object tag from which I can display message also. – Himanshu Bhandari Apr 24 '15 at 09:24
  • You can do a ajax request, which is not server-side – Invoku Apr 24 '15 at 10:16
  • I am getting data through AJAX request only, in form of JSON, which have file path as in my earlier comment. If you are talking any other way than please explain. What if I go with simple object tag, any disadvantage? However I know that it is an old tag to use, but no other way. – Himanshu Bhandari Apr 24 '15 at 10:54
  • There was a way, but Access-Control-Allow-Origin prevents it. It's doing a head request to the page and check the mime-type (this way it doesn't even matter if the link ends with .pdf or not). I think you need to do something server-side, sorry. – Invoku Apr 24 '15 at 21:04
0

I couldn't find any solution to display message in iframe, may be it doesn't provide, so I switched to object tag.

<object data="[path to .doc]" type="application/msword">
<p>It appears you do not have a Suitable plugin for this browser. You can download this file.
    <a href="[path to .doc]">
    <button type="button">download</button></a>
</p>

Himanshu Bhandari
  • 1,769
  • 2
  • 23
  • 37