ansaurus

Question

How can I display some text when an embedded object fails to display?

Answer 1

+4 A:

You can put any inline elements within the object tag, and if it fails to load, they will be presented to the user.

<object>
  This object failed to load,
  try to install <a href="http://plugin-site/"&gt;here&lt;/a&gt;
</object>

MSDN: OBJECT Element | object Object

Wanted to add some notes about odd IE behaviors. (IE < 8) When using the above code where failure content is to be displayed, you will lose access to the object in DOM. So you may want to keep it empty and do some extra code to determine the load success.

<!DOCTYPE html>
<html>
<head>
  <title>so-objects</title>
  <script type="text/javascript">

    function add(text) {
      document.body.appendChild(document.createElement("div"))
                   .appendChild(document.createTextNode(text));
    };

    function each(o, f, c) {
      for (var i=0, l=o.length; i<l; i++) f.call(c, o[i], i, o);
    };

    onload = function() {

      // IE returns null and has mysteriously removed the object from DOM
      add("byId = "+ document.getElementById("no-access") );

      // IE returns 2 instead of 3
      add("byTags = "+ document.getElementsByTagName("object").length );

      // verify successful load if the object property is available
      each(document.getElementsByTagName("object"), function(node) {
        add(node.id +" = "+ !!node.object);
      });

    };

  </script>
  <style type="text/css">
    object, span { position: absolute; left:-10000px; }
  </style>
</head>
<body>

  <object id="access">
  </object>

  <object id="no-access">
    <span>failed</span>
  </object>

  <object id="supported"
     classid="clsid:6bf52a52-394a-11d3-b153-00c04f79faa6">
  </object>

</body>
</html>

Returned values for IE < 8

byId = null
byTags = 2
access = false
supported = true

Returned values for W3C Compliant

byId = [object HTMLObjectElement]
byTags = 3
access = false
no-access = false
supported = false

Try for yourself

Mister Lucky 2009-03-31 19:59:23

You might want to clean up your example, especially the closing tag. And I don't think it's restricted to inline elements. +1 for the right answer though.

rmeador 2009-03-31 20:01:40

Thanks for the typo catch. I mention the inline because I faintly recall having DOM issues when I tried using some block ones (in IE that is!)

Mister Lucky 2009-03-31 20:04:17

Thanks Mister L. I still only get what is referred to in this post as the "colorful icon" (http://blog.jonschneider.com/2007/04/windows-forms-controls-in-ie.html). I also have a fusion bind error that shows up in my temp internet files.

Paul G 2009-03-31 20:43:40

Thanks! I tried this on a machine that is able to load the control and a machine that is not. In both cases, I get the [object] for the byID, 1 for the byTags, and a line that says MyUserControl = false. I'll keep working, but will credit you with an answer. I suspect I'm doing something wrong.

Paul G 2009-04-01 13:02:24

It's probably not that you're doing it wrong, but it sounds like the control is causing an exception in it's initialization code, that doesn't quite bubble out to the DOM/JS scope. So it needs to be debugged at the higher level of within your Control code.

Mister Lucky 2009-04-01 16:46:26

Answer 2

+1 A:

Adding another answer more specific to your situation.

Changing your javascript to this may produce the desired results (if there's only the one instance of this object being applied to the page).

function onchange(o) {
  if (o.readyState == 4) {
    if (o.object == null) {
      alert("UserControl is not installed, please email your administrator.");
      // or, toggle display of a message dialog in HTML
      //document.getElementById("not-installed").style.display = "block";
    }
  }
};

document.write('<object id="MyUserControl"');
document.write(' classid="MyUserControl.dll#MyNamespace.MyUserControl"');
document.write(' height="611" width="951" onreadystatechange="onchange(this)">');
document.write(' <param name="Parm1" value="' + parm1 + '" />');
document.write('</object>');

Mister Lucky 2009-04-01 17:39:21

ansaurus

tags:

views:

answers:

How can I display some text when an embedded object fails to display?

related questions