swfobject not executes after ajax call - ajax

I've two php-scripts: the first makes ajax call to the second, which returns javascript code and div for swfobject. I'm calling the second file twice: after loading page(it works ok and I can see swfobjects) and after users' clicking on button(it not works and div just goes blank).
I suggest that embedSWF works ONLY after pages' loading, because my ajax calling is correct.
But a way must be found! Any ideas?

Yes, swfobject.embedSWF is designed to work after page load -- it has a built-in domload event handler.
If you don't want swfobject to automatically embed when the page is loaded, use swfobject.createSWF instead. The official documentation explains how swfobject.createSWF works.
EDIT:
After re-reading your post, I see you want to embed a SWF after the page has already loaded. swfobject.embedSWF can be used in both cases. Here's a tutorial and an example.

Related

jQuery mobile - after browser refresh page totally messed up

I'm developping a jqm application with spring mobile in the back-end.
Whenever I hit the browser refresh button on my mobile phone the page is completely devastated afterwards. Browsers back-button works properly.
The data are still available due prg pattern (flashAttributes in Spring) after refresh. Only the view is malformed.
Any ideas how to solve this problem?
From jQuery Mobile docs :
The simplest approach when building a jQuery Mobile site is to reference the same set of stylesheets and scripts in the head of every page. If you need to load in specific scripts or styles for a particular page, we recommend binding logic to the pageinit event (details below) to run necessary code when a specific page is created (which can be determined by its id attribute, or a number of other ways). Following this approach will ensure that the code executes if the page is loaded directly or is pulled in and shown via Ajax
So what happens is - in jQuery Mobile, the scripts and styles defined in the head are loaded only once. So, in normal conditions, it works fine, as all the pages will use the scripts loaded from the first page.
But. When you refresh a page in-between, it triggers a page-reload instead of the ajax navigation model thatjqm uses. So all the scripts and styles loaded from the first page will not be included from here on out.
What you need to do is "reference the same set of stylesheets and scripts in the head of every page", so that even if you hit refresh in the middle, the scripts and styles that had been loaded from the head of the first page are loaded again.
I recommend you read the docs from the above link fully to gain a better understanding.

Facebox Fails When Loaded via AJAX

I have a very simple HTML page at http://bit.ly/1eaSnKt
The first line is a functioning Facebox link. Note that, when clicked, it opens the FaceBox popup perfectly.
The second line is a similar link, but exists on a different HTML page which is pulled via AJAX (see source). For some reason, when clicked, it fails to open the FaceBox popup. Does anyone have a clue why this is failing? Thanks.
When your page loads, on Document ready, you are attaching the behaviors to the items in the page.
With the Ajax load, it loads the items after the document is ready, and there jQuery has attached the behaviors... missing your new content.
You need to attach those behaviors after the ajax is successful.
So after the ajax load, use a callback, or a closure to do this
$('a[rel*=facebox]').facebox({
loading_image : 'facebox/loading.gif',
close_image : 'facebox/closelabel.gif'
})
Hope that makes sense.
Thanks all. I actually found the solution here - https://github.com/dator/facebox/commit/5ce6a75927d81b9fff1eeff9b933f0ad93f12801

FB Comments loaded via ajax div

Here's my issue, I'm trying to load a FB comments module via an AJAX div. Now, it works if I go directly to the php page, but if I load it from within the div, it doesn't. I've looked at the other posts (FB javascript SDK after jquery LOAD (ajax)), but still can't seem to get it to work, looking for clarification.
If you want to see what I'm talking about, check http://azconceptphoto.com/lindsey and check out testimonials.
Ideally, on the normal part of my site, I can just load the HTML5 code and it works fine, though for some reason it doesn't remotely work via the AJAX div. And considering the posts from before are out of date (2011), I was hoping to get more feedback on this.
Based on the code from your link you are not using any of the PrototypeJS Ajax methods to get the backend script. Ajax.Updater is the method you need to use so....
Here is my suggestion
change the definition of loadXMLDoc() to
function loadXMLDoc(div, location)
{
new Ajax.Updater(div,location,{'evalScripts':true});
}
this will update the contents of div with the contents of location. Also if the response has <script> tags in it then the javascript will be parsed and evaluated (thats the option evalScripts)

Colorbox is not loading ajax content

Read Chain
$(".ReadChainDL").colorbox();
When I click the Read Chain it runs the ajax and loads the colorbox, but the colorbox is blank! I can confirm that ajax is running and pulling the correct content via firebug. It's just not populating the generated ajax content into the colorbox. I've confirmed via firebug that colorbox is blank.
I've tried it in Firefox and Chrome
It's got to be the URL; your code works fine. Proof: http://jsfiddle.net/HP8tN/
I think there are two main possibilities:
There's no filename, so maybe Colorbox doesn't know what content type to use. Or maybe the URL is wrong, or the target has the wrong content type. I think this is the most likely option. Try $(".ReadChainDL").colorbox({photo: true}); if it's a photo. Otherwise, check out the Content Type section in the documentation.
Colorbox is supposed to figure out whether you've passed it a URL or a jQuery-style XPath selector. The 10/12/2012 could be messing up whatever logic it uses to recognize a URL. This seems unlikely, since you've confirmed that something is coming back, but it's worth a try. Try 10%2F12%2F2012 instead.
Can you post the content that is being returned by the ajax call? jQuery may not be able to append it to your document if there are issues with it being invalid or malformed.
Try validating your content.

Executing AJAX scripts within an AJAX response

I'm having trouble using AJAX page updates along with other AJAX scripts.
During a normal page load, the AJAX scripts (picture scrolling and picture thumbnails) work fine. But when I update a page with AJAX, these scripts (usually loaded in the header of the initial page load) stop working.
I am wondering if this is specific to these scripts and I need to look into them deeper to resolve/re-write or if I am missing something more generic in combining AJAX page updates with AJAX scripts the returned code relies on.
Embedded javascript runs fine.
Thanks for your ideas!
PS: The scripts I am using are from www.dynamicdrive.com are:
1) stepcarousel (http://www.dynamicdrive.com/dynamicindex4/stepcarousel.htm) and
23) thumbnailviewer (http://www.dynamicdrive.com/dynamicindex4/thumbnail.htm) from the
Try doing this on Firefox, using the Firebug debugger, so you can single-step through and determine what is going on with the javascript. If you are using IE8 then you can hit F12 and bring up the debugger for that environment also.
Once you have some idea what is going on then you can explain what you are seeing, what browsers you have tried and you will get more help.

Resources