www.webdeveloper.com
Results 1 to 8 of 8

Thread: changing html <object> data="" string on mouseover

  1. #1
    Join Date
    Feb 2004
    Posts
    3

    changing html <object> data="" string on mouseover

    I'm trying to create an onClick that will change an embedded html page. I'm using the same syntax that works for both <img> and <iframe>.

    Code:
    <object id="thing" data="page1.html" type="text/html">
    error message
    </object>
    
    <a href="#" onClick="javscript:document.getElementById('thing').data='page2.html';">
    click
    </a>
    There must be some fundamental difference between changing an image or iframe "src" and changing an object's "data" that totally escapes me because the above script won't update/refresh/reload/change the existing embedded page (page1.html) to page2.html.

    I have run the script with an "alert(document.getElementById('thing').data)" tacked onto the end of the above script, and it does, in fact, return "page2.html" in the dialogue box. So, maybe, I just need to refresh the object (without reloading the whole page!)?

    I've noticed that <object> is usually used with applets and flash and sound and there seem to be commands to "run" them, but I can't find any terms to handle updating an embedded html document. Maybe there really just isn't any way to do this yet aside from iframe?

    -- H

  2. #2
    Join Date
    Jul 2003
    Location
    Boston Area, Massachusetts
    Posts
    3,489
    Originally posted by hap01
    javascript:document.getElementById('thing').data
    Though, even when corrected, that's still invalid. The JavaScript pseudo-protocol should never be used unless in the one exception of bookmarklets. Code inside of an event handler only needs the JavaScript code; nothing less, nothing more. Though, I can't really say for sure if it will work or not without doing a bit more testing. Maybe try using setAttribute?

    Moreover, why exactly would you need to do something like this? If you need to dynamically include pages, use server-side if available. If not available, you should really consider switching to a host in which gives you access to server-side.

    Another possible solution, however, would be to use DOM functionality — you could change the data attribute of the element and then reappend it to the document perhaps causing it to actually load the page specified.

  3. #3
    Join Date
    Feb 2004
    Posts
    3
    I don't knowall that much about javascript and haven't yet understood the term "pseudo-protocol", but if by that you mean that the instructions shouldn't be in the link but up in the <head>, then, okay, good tip to know, but it still doesn't work (even without the typo, which isn't in the original).

    What you say here sounds intriguing: "use DOM functionality you could change the data attribute of the element and then reappend it to the document perhaps causing it to actually load the page specified." I have no idea what you mean. But at least you've supplied me with some terms to search for (hah. I'm not kidding, it's hard to find answers when you have no idea what keywords your solution is going to contain.)

    And, yes. I could use php. I even know how to do that. And it's a long story why I'm using javascript for this, but suffice to say that I'm not the designer, just the developer, and the designers can't deal with the php development process.

    And, yes, I can (and am) using the <iframe> element just fine. So, no, this isn't life or death by a long shot, it's just a point of curiosity and, also, a standards thing. My understanding is that the w3.org is driving to eliminate all the special embedding codes (img, applet, frames, etc.) and aiming for one tag, <object>, to be more, I don't know, xml-compliant? Or maybe just more neat-and-tidy? And it just seems a little *odd* that the web's (tragically) favorite gimic, the dreaded image-swapping mouseover, won't work with the object tag.

    Thanks for the help.

    -- H

  4. #4
    Join Date
    Jul 2003
    Location
    Boston Area, Massachusetts
    Posts
    3,489
    Originally posted by hap01
    I don't knowall that much about javascript and haven't yet understood the term "pseudo-protocol"
    It just means that it isn't actually a real protocol. I'm referring to javascript&#58; if you've not yet realized; sorry for the lack of clearness.
    Originally posted by hap01
    but if by that you mean that the instructions shouldn't be in the link but up in the <head>, then, okay, good tip to know, but it still doesn't work (even without the typo, which isn't in the original).
    I was actually referring to how you prefixed your code with javascript&#58; (i.e., the JavaScript pseudo-protocol).
    Originally posted by hap01
    What you say here sounds intriguing: "use DOM functionality you could change the data attribute of the element and then reappend it to the document perhaps causing it to actually load the page specified." I have no idea what you mean.
    Very sorry yet again. What I mean in laymans terms is this: using the functionality of the DOM (Document Object Model), you could basically make it so that it will rewrite the tag to the document thus possibly making it load the file.
    Originally posted by hap01
    And, yes. I could use php.
    I'm sure you mean you should use PHP.

    Seriously, relying on JavaScript for something as important as navigation for a site is considered a huge mistake. PHP will streamline this entire process and make the site accessible and usable for all.
    Originally posted by hap01
    I even know how to do that.
    It's actually quite simple. If you search these forums for something like "includes" or possibly "*php* includes* you'll find plenty of examples. Moreover, the PHP manual has everything you'll ever need.
    Originally posted by hap01
    And it's a long story why I'm using javascript for this, but suffice to say that I'm not the designer, just the developer, and the designers can't deal with the php development process.
    Maybe you can't deal with it, but you could let the developers know how it should be done. Though, as aforementioned, it's incredibly simple and thus you probably could deal with it.
    Originally posted by hap01
    And, yes, I can (and am) using the <iframe> element just fine.
    Actually you are not. I would not recommend iframes because they're harmful. They're inaccessible and should be avoidied completely. If you require dynamic file inclusion, use server-side (i.e., PHP).
    Originally posted by hap01
    So, no, this isn't life or death by a long shot, it's just a point of curiosity and, also, a standards thing.
    If you care at all about Web standards or more specifically Web accessibility, you would not make your site rely on JavaScript.
    Originally posted by hap01
    My understanding is that the w3.org is driving to eliminate all the special embedding codes (img, applet, frames, etc.) and aiming for one tag, <object>, to be more, I don't know, xml-compliant?
    Though, it should be avoided when possible — which it is since you have PHP available — and moreover, even though <object> may have its uses at times, this is definitely not one of them and remember that browser implementations of it are rather quirky. Mozilla supports it, however, (figures) IE doesn't (correctly, anyway). Can't really speak for Opera though I would imagine it should. Regardless of the support for it, server-side would be the ideal solution by far.
    Originally posted by hap01
    Thanks for the help.
    No problem whatsoever. Again, sorry for using the technical terms. If you ever need clarification please don't hesitate to ask.

  5. #5
    Join Date
    Feb 2004
    Posts
    3
    Originally posted by fredmv
    I'm sure you mean you should use PHP.
    hahahaha. Okay! Okay!

    BUT the designers CAN'T SEE PHP DOCUMENTS in GoLive. They can't download and edit anything on the fly in their wysiwyg worlds and they can't run the changes locally because no one has php installed (I am certainly not being paid enough to do that for them). And this isn't a huge enterprise operation, it's just an art gallery site that I'm doing the coding for.

    Originally posted by fredmv
    Seriously, relying on JavaScript for something as important as navigation for a site is considered a huge mistake. PHP will streamline this entire process and make the site accessible and usable for all.
    Accessible to users but not to the people making the updates (designers and clients), who can't see or run the php on their local machines. You don't just build web pages for the web, you also build them for the people who have to maintain and update them.

    Originally posted by fredmv
    (iframes) They're inaccessible and should be avoidied completely.
    The iframe/object isn't be used for anything mission-critical, it's just a thumbnail gallery mouseover. And it degrades just fine, thank you. If the javascript fails, the link just opens another window. It looks great in lynx (though one wonders why anyone using lynx would be viewing an art gallery site) and spiders can follow all the little hrefs happily caching away.

    Javascipt might be a lame way to serve dynamic content, but if it were php (and correct me if I'm wrong, but this is how I've done it before) it would merely link to a script (which isn't great for search engines) that would rewrite the entire *page* every time (this is probably me, but I can't figure out how to get php to only reload part of a page, it seems impossible to do without frames or embedded objects and looks too jerky otherwise).

    The client wanted an image gallery mouseover with text titles and descriptive paragraphs for each "image" and the text can't be part of the image because of the way the copy-writing is being done, so the iframe-embedded html was my solution that would meet both the edit-ability requirements and the proceess requirements.

    Originally posted by fredmv
    even though <object> may have its uses at times, this is definitely not one of them and remember that browser implementations of it are rather quirky.
    So, I suppose, the answer to my original question (why doesn't my scipt work and is there a way to make object data swaps work with javascript?) is that <object> is a badly supported tag. That although browsers are designed to reload newsources for image and iframe upon using this kind of javascript, they are not designed to automatically reload new object data sources. So, until some future browser release, I can't have javascript object swaps, and, by that time, GoLive will be able to handle displaying php files, all the osx machines will ship with php installed, and I won't ever have to bother with javascript again.


    -- H

  6. #6
    Join Date
    Dec 2011
    Posts
    1

    The torture never stops...

    Quote Originally Posted by hap01 View Post
    So, I suppose, the answer to my original question (why doesn't my scipt work and is there a way to make object data swaps work with javascript?) is that <object> is a badly supported tag. That although browsers are designed to reload newsources for image and iframe upon using this kind of javascript, they are not designed to automatically reload new object data sources. So, until some future browser release, I can't have javascript object swaps, and, by that time, GoLive will be able to handle displaying php files, all the osx machines will ship with php installed, and I won't ever have to bother with javascript again.
    LOL... I ran into the same problem today. Almost eight years later! Was using Google Chrome for testing, couldn't get that Object to reload. Conclusion: Works fine in Firefox, Opera, and SeaMonkey... Doesn't work in Chrome and Internet Explorer...

  7. #7
    Join Date
    Apr 2012
    Posts
    1

    Chrome doesn't reload <object> after DATA param change

    Hey alianto!

    I have the same problem. Reported an issue to Chrome Project with number: 123536 (http://code.google.com/p/chromium/issues).

    But, I found a temporary solution to this!! Take a look at:
    http://www.createblog.com/html-tutor...-in-xhtml-1.1/

    The guy uses the DOM to clone the object element and add a new with the DATA param changed, and it works!! Copy and past the code at the page in URL and see yourself!!

    I hope that Chrome fix it in newer versions. To me this behavior no makes sense.... still with the same content after a DATA change...

  8. #8
    Join Date
    Apr 2012
    Location
    New Delhi
    Posts
    4
    I have not understand what is this?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles