PDA

View Full Version : Resolved Accordion Script that reloads secondary page each time.



motorhog
12-30-2012, 08:12 PM
1) Script Title: :: Accordion Content script (v2.0)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ddaccordion.htm

3) Describe problem:

I have implemented the script on a request page. when the request is clicked on, it drops down an additional page with more information, (using the "hiddenajaxlink" method) this works perfectly.

As described in the script instructions. the ajax call for the secondary page only loads the raw data on the first call then subsequently uses cached data. is there anyway to force the script to load fresh data each time. The information it is loading changes throughout the day so it has to be loaded fresh each time to be sure we are showing the most up-to-date information to our users.

Or is there another script that would allow me to do the same thing.

Thanks

Michael Kennedy
IT Manager

Nile
12-30-2012, 09:30 PM
I'm just guessing here, but open up ddaccordion.js and delete the following line (you can find it using CTRL+F).

ajaxinfo.status="loading" //set ajax status to "loading"

motorhog
12-30-2012, 10:25 PM
I'm just guessing here, but open up ddaccordion.js and delete the following line (you can find it using CTRL+F).

ajaxinfo.status="loading" //set ajax status to "loading"

Thanks Nile, but that didn't work. I tried the same thing with a couple of other lines that looked like they might be what i was looking for but they also did nothing.


ajaxinfo.cacheddata=content //remember ajax content
ajaxinfo.status="cached" //set ajax status to cached

any other ideas??

Beverleyh
12-30-2012, 11:01 PM
What if you change the "cached" part of that second line to "none"?

ajaxinfo.status="none" //set ajax status to cached

motorhog
12-30-2012, 11:30 PM
Have tried that, and in several other places. all it seems to do is A. Nothing or B. just shows the loading... text

Beverleyh
12-30-2012, 11:52 PM
I can't really test much from iPhone but the demo page appears to null the cache on page refresh (so I'm surmising from the loading image before the content loads again) so presumably if you refresh the page and trigger the header, the revised Ajax file will load in too. So what if you employ the URL + parameter mechanism that does that (as used on the demo's plain text links), in the actual headers themselves?
<a href="currentpage.htm?mypets=2">Reload page and select the 3rd content using a URL parameter</a>
Its a refresh + reload file + expand content, all in one go - Would that work for you?

Nile
12-31-2012, 12:10 AM
Sorry about the troubles. I was able to look through the file, so this should do the trick if I'm not mistaken. Restore to the original file and delete the following line (line 60, for clarification).

ajaxinfo.status="cached"
That should do it

motorhog
12-31-2012, 12:20 AM
That function seems to be for the Last example which has the additional content in a <div> rather than calling it from an external url.

When i refresh the screen it doesn't clear the cache that the ajax script/calls are using. i have to completely close the browser for it to reload and display any changes made to the additional info files.

I think is is something in the ddaccordion.js file but just not sure. there are lots of if statement relating to content and ajax but in all honesty Javascript and ajax are a bit alien.

Thanks

motorhog
12-31-2012, 12:24 AM
Sorry about the troubles. I was able to look through the file, so this should do the trick if I'm not mistaken. Restore to the original file and delete the following line (line 60, for clarification).

ajaxinfo.status="cached"
That should do it

Hi Nile, i had tried that earlier and it didnt have any effect. I have re-tried it and still does not reload the file.

Nile
12-31-2012, 12:25 AM
That's odd. I'm going to set this up locally and give it a try. In the meantime, restore to default and find the following lines (94-100):

if (ajaxinfo.status=="none" || ajaxinfo.status=="loading")
this.ajaxloadcontent($targetHeader, $targetContent, config, function(){ddaccordion.expandit($targetHeader, $targetContent, config, useractivated, directclick)})
else if (ajaxinfo.status=="cached"){
$targetContent.html(ajaxinfo.cacheddata)
ajaxinfo.cacheddata=null
ajaxinfo.status="complete"
}
And replace them with

if (ajaxinfo.status=="none" || ajaxinfo.status=="loading" || ajaxinfo.status=="cached") {
ajaxinfo.status = "none";
this.ajaxloadcontent($targetHeader, $targetContent, config, function(){ddaccordion.expandit($targetHeader, $targetContent, config, useractivated, directclick)})
}

To see if that works

motorhog
12-31-2012, 12:48 AM
Hi Nile,

i appreciate your help with this.
your last suggestion had no effect either.

Thanks

Nile
12-31-2012, 01:22 AM
Tested solution: Find the following lines (67-69) and add what's highlighted. You could also, instead, just copy and paste this (http://eg.jfein.net/help/motorhog/ddaccordion.js) whole file.


if (ajaxinfo.status!="complete"){
setTimeout(function(){handlecontent(ajaxinfo.cacheddata)}, 100) //call handlecontent() again until ajax content has loaded (ajaxinfo.cacheddata contains data)
}
ajaxinfo.status = "none";

motorhog
12-31-2012, 12:18 PM
Im afraid it is still not working for me.

how did you test your solution, just to be sure im not doing anything wrong?

thanks

Beverleyh
12-31-2012, 02:03 PM
I can confirm that Nile's revised file does indeed work.

If you copy and paste the code from the demo page into the appropriate places of a blank page on your server, download the file provided by Nile, then create a "mycontent.htm" page and initiate the Ajax example (as given on the demo page);

<h3 class="mypets">Rabbits</h3>
<div class="thepet">
<a class="hiddenajaxlink" src="mycontent.htm">LangKawi</a>
</div>the "mycontent.htm" file will never be cached and always load afresh, even without reloading the main page. Just edit the content in the "mycontent.htm" page and click the Rabbits header to see it load it with the changes.

Also, you might need to clear your browser cache in case its still pulling in the old js file.

If the problem is still there for you, please give us a link to your page so we can help you troubleshoot.

Beverleyh
12-31-2012, 02:15 PM
That function seems to be for the Last example which has the additional content in a <div> rather than calling it from an external urlJust to help clarify the point you raised yesterday - yes, it's the example given for the last header/content pairing in the demo (Rabbits) which uses a content div in this example, but the function works when the content file is called via Ajax too. Either way works fine.

Nile
12-31-2012, 03:28 PM
I can confirm that Nile's revised file does indeed work.

If you copy and paste the code from the demo page into the appropriate places of a blank page on your server, download the file provided by Nile, then create a "mycontent.htm" page and initiate the Ajax example (as given on the demo page);

<h3 class="mypets">Rabbits</h3>
<div class="thepet">
<a class="hiddenajaxlink" src="mycontent.htm">LangKawi</a>
</div>the "mycontent.htm" file will never be cached and always load afresh, even without reloading the main page. Just edit the content in the "mycontent.htm" page and click the Rabbits header to see it load it with the changes.

@Beverlyh - Just to make sure, did you copy and paste what you pasted above? I found an error in the documentation where it incorrectly says src instead of href (I had to debug for like 10 minutes until I figured it out). I've reported this as a bug in the bug reports forum.

@motorhogs - In order to test, click on the link that loads the fie, then change the contents of the file, save, then go back to the browser and click on a different accordon header, then click back on the one that loads the file. You can see it in action here: http://eg.jfein.net/help/motorhog/, where you'll notice that every time you click on the "Cats" or the "What is ajax?" heading you'll see the loading sign again.

motorhog
12-31-2012, 04:42 PM
Thanks for the Suggestions,

the page can be found here

http://217.33.170.88/cgi-bin/classads/requests.pl?newparts&Parts+requests&all

if you click on one of the test requests, it will drop down a second page with a form. using that form, enter your initials, a test message in the larger box and then tick the CALL tick-box, then hit SEND.

this will log the message you have just typed, thus changing the file that is called. when you click OK on the next page it will take you back to the main page, if you then click on the request again, the message you have just sent is not visible.

unless you close your browser then re-open it and click on the request again, then it shows. But i do get the loading content circle each time a header is clicked on

@Nile, you are correct with your SRC/HREF problem, i had set it to HREF by mistake in the first place, i changed it to SRC to see if it did anything and all that happens is the Loading Content circle stays on screen. it is now set back to href.

Nile
12-31-2012, 05:00 PM
I've given it a few tries and I am witnessing the effect you're talking about intermittently (i.e, it does work some of the time, but other times it doesn't). I'm making a hypothesis that it has something to do with browser caching. Use the file I've linked to above but find the following lines and add what's highlighted.

$.ajax({
url: ajaxinfo.url, //path to external menu file
cache: false,
error:function(ajaxrequest){
handlecontent('Error fetching content. Server Response: '+ajaxrequest.responseText)
},
success:function(content){
content=(content=="")? " " : content //if returned content is empty, set it to "space" is content no longer returns false/empty (hasn't loaded yet)
handlecontent(content)
}
})

Beverleyh
12-31-2012, 05:09 PM
@Beverlyh - Just to make sure, did you copy and paste what you pasted above? I found an error in the documentation where it incorrectly says src instead of href (I had to debug for like 10 minutes until I figured it out). I've reported this as a bug in the bug reports forum.I didn't even notice that. To be honest, no I didn't - I typed the hyperlink manually when I tested last night and only today (since I'm back on my iphone) did I go back to the demo page for convenience to copy and paste the markup snippet from there.

Nile
12-31-2012, 05:10 PM
I didn't even notice that. To be honest, no I didn't - I typed the hyperlink manually when I tested last night and only today (since I'm back on my iphone) did I go back to the demo page for convenience to copy and paste the markup snippet from there.

Alright -- just wanted to make sure we were all doing the same thing.

motorhog
12-31-2012, 05:12 PM
Hi Nile,

thanks for that. it works perfectly now.

Regards.

Nile
12-31-2012, 05:14 PM
No problem, I'm glad to help :D

In an effort to keep things organized, you have the option to set a thread to resolved when an issue is fixed. To make the status of the thread resolved:
1. Go to your first post
2. Edit your first post
3. Click "Go Advanced"
4. In the dropdown next to the title, select "RESOLVED"