I'd still suggest moving to the generated JavaScript approach I outlined.
Hopefully it will look less complicated now that you've gotten some sleep.
:-)
Was it the document.write call that seemed complicated?
> document.write(
> '<script type="text/javascript" src="readimages.php?',
> 'imagefolder=', folderName, '&',
> 'imageprefix=', imagePrefix, '&',
> 'random=', Math.random()*99999,
> '">',
> '<\/script>'
> );
Let's break that down a bit. All it's doing is generating a <script> tag and
writing it into the page. I see your test page is down now, so let me assume
that folderName is "folder" and imagePrefix is "prefix". Then the script tag
that the code generates would look like:
<script type="text/javascript"
src="readimages.php?imagefolder=folder&imageprefix=prefix&random=12345.6789"
>
</script>
The document.write function takes all of its arguments and concatenates them
into a single string, so it generates code like that. It's a great way to do
something like what you're doing here - faster than the XML download and
avoids locking up the browser the way a synchronous Ajax call does.
Give a shout if you have any questions about it...
-Mike
> From: David Andrews
>
> Thanks Mike - although it seems a little complicated to me at
> first sight (I'm not a java developer) - I'm sure I will get
> my head round it! One more cup of coffee! :)
>
> For those that are interested My XML was failing due to the
> content type of the document not being correctly set - added
>
> header("Content-type: text/xml");
>
> to my PHP generated file and now everything works as it
> should.. 5 hours of my life I won't get back. :(
>
> I will have another look at your suggestion below once I have
> had some sleep
> - is 5:22 am here..
>
> Good night everyone and thanks for your help!
>
> :)
>
> Dave
> From: Michael Geary
>
> If the XML is really that simple, then the JSON format can be
> even simpler.
> Just use an array:
>
> [ "onr_fc2.jpg", "onr_fc2.jpg", "onr_fc2.jpg", "onr_fc2.jpg" ]
>
> Then your code looks like:
>
> success: function( files ) {
> for( var i = 0; i < files.length; ++i )
> do_something( files[i] );
> }
>
> As you can see, JSON is nothing more than the native
> JavaScript literal format for objects, arrays, and simpler
> data types such as strings and numbers. Because it is the
> native JavaScript format, there is no parsing required - the
> JavaScript interpreter already knows how to parse it, and you
> can access object properties and array elements directly.
>
> But here is a much better solution. Since you are loading
> this data file once when the page loads, simply have
> readimages.php generate a complete JavaScript statement:
>
> var imageList = [ "onr_fc2.jpg", "onr_fc2.jpg",
> "onr_fc2.jpg", "onr_fc2.jpg"
> ];
>
> Then remove your $.ajax call from the $(document).ready()
> function, and replace this statement:
>
> var imageList = [];
>
> with:
>
> document.write(
> '<script type="text/javascript" src="readimages.php?',
> 'imagefolder=', folderName, '&',
> 'imageprefix=', imagePrefix, '&',
> 'random=', Math.random()*99999,
> '">',
> '<\/script>'
> );
>
> Note that this code goes outside the $(document).ready()
> function. Where you have the var imageList = [] is a perfect
> place to put it.
>
> Then you will have your imageList filename array ready to use
> without any Ajax downloads or XML parsing. This will avoid
> any possibility of locking up the users's browser (and other
> browser windows) while the page loads. It's a lot simpler and
> better for the user too.
>
> -Mike
>
> > From: Jeffrey Kretz
> >
> > Well, it was a bit of a pain to step through, as it was minimized
> > jquery -- the full uncompressed version is much better for
> debugging.
> >
> > But as I stepped through, the success method did actually fire.
> >
> > The problem was that $(xml).find('file') did not return any results.
> >
> > I've never used jQuery to traverse XML nodes, so maybe someone else
> > can help. Here was the XML result I got:
> >
> > <?xml version="1.0" encoding="iso-8859-1"?> <filelist>
> > <file>onr_fc2.jpg</file>
> > <file>onr_whd.jpg</file>
> > <file>onr_lbp.jpg</file>
> > <file>onr_egwt.jpg</file>
> > <file>onr_mpr.jpg</file>
> > <file>onr_fifa.jpg</file>
> > <file>onr_waw.jpg</file>
> > <file>onr_main.jpg</file>
> > <file>onr_r2.jpg</file>
> > </filelist>
> >
> > But as Mike said, json would be an easier way to do it. The data
> > would look something like this:
> >
> >
> [{file:'onr_fc2.jpg'},{file:'onr_fc2.jpg'},{file:'onr_fc2.jpg'
> },{file:'onr_f
> c2.jpg'}]
> >
> > jQuery would then use eval() to convert that into an array
> of objects.
> > Your success function would do something like this:
> >
> > success:function(files){
> > for (var i=0;i<files.length;i++)
> > {
> > do_something(files[i].file);
> > }
> > }
> >
> > JK
> >
> > -----Original Message-----
> > From: jquery-en@googlegroups.com
> > [mailto:jquery-en@googlegroups.com] On Behalf Of David Andrews
> > Sent: Saturday, November 29, 2008 7:25 PM
> > To: jquery-en@googlegroups.com
> > Subject: [jQuery] Re: .ajax and ie7?
> >
> >
> > Thanks Mike and JK,
> >
> > A sample url is here..
> >
> > www.foobar.me.uk/test/example.htm
> >
> > To answer your questions:
> >
> > 1. This does seem to be required as it loads the image
> names into an
> > array which is then used to populate the image src in the DOM. If I
> > leave async true then I get empty images for the first couple of
> > transitions.
> >
> > 2. Thanks for the tip on JSON - not familiar with it but
> will do some
> > research - cheers.
> >
> > -----
> >
> > If you open the above link in firefox then you will see some image
> > transitions based on an array populated from my ajax
> request - in IE
> > that array does not get populated as it looks like the ajax
> request is
> > not getting called.
> >
> > Also - don't get me wrong I'm not anti IE - just asking! ;)
> >
> > Cheers
> > Dave
> >
> >
> >
> >
> >
> > -----Original Message-----
> > From: jquery-en@googlegroups.com
> > [mailto:jquery-en@googlegroups.com] On Behalf Of Michael Geary
> > Sent: 30 November 2008 03:10
> > To: jquery-en@googlegroups.com
> > Subject: [jQuery] Re: .ajax and ie7?
> >
> >
> > Of course Ajax works in IE. IE is the browser that invented Ajax
> > (XMLHttpRequest)!
> >
> > Troubleshooting a code snippet is a lost cause. ;-) Can you post a
> > link to a test page?
> >
> > A couple of tips, not directly related to the IE problem...
> >
> > async: false is an extreme measure that should be avoided
> if possible.
> > It locks up the user interface of all browsers running in the same
> > thread. Do you have to do that?
> >
> > It sounds like you are in control of the PHP code that
> generates the
> > XML, is that right? If so, you would be better off generating JSON
> > instead of XML.
> > It's easier to work with JSON, and much faster too.
> >
> > -Mike
> >
> > > From: David Andrews
> > >
> > > Hello all,
> > >
> > > I am using .ajax to populate an array via a PHP generated XML file
> > >
> > > //snip
> > >
> > > $.ajax({
> > > url : "readimages.php",
> > > async : false,
> > > data : "imagefolder=" + folderName + "&imagePrefix=" +
> > imagePrefix,
> > > success : function(xml)
> > > {
> > > $(xml).find('file').each(function()
> > > {
> > > imageList.push($(this).text());
> > > });
> > > }
> > > });
> > >
> > > This works perfectly in FF but the success function does not get
> > > called when run in IE7... should this code work ok or is
> IE a lost
> > > cause?
> > >
> > > Cheers
> > > Dave
> >
> >
>
No comments:
Post a Comment