Loading articles via AJAX, anyone?

diniscorreia · 2007-12-13 16:50:55

Hi there,

I’ve searching the forums for a simple way to show an article using AJAX, but I’m yet to found a simple solution.

Basically, I’m doing a very simple portolio site. The homepage will basically list article’s titles. I would like to click on a title and have the respective article being loaded via AJAX on a new div right after the title.

Are there any plugins? Anyone every tried something similar?

This looked very simple at first, but I don’t really know where to start :)

Thanks a lot!

Last edited by diniscorreia (2007-12-13 16:51:11)

net-carver · 2007-12-13 16:59:42

Dinis

I’ve not seen anything on the public interface, but the back end has something very similar that might be a place to start for you.

Take a look at wet_quicklink and “wet_peex” (there’s a link to that on the first plugin’s home page.)

Bloke · 2007-12-13 19:20:28

diniscorreia wrote:

I would like to click on a title and have the respective article being loaded via AJAX on a new div right after the title.

Spookily, I was thinking about this very thing a couple of hours ago for a site I’m working on. In theory it should be a cinch for jQuery, with its built-in AJAX support, to call the back-end article() function, pass the relevant name/id, retrieve the article and dump it in the object of your choice.

But from a plugin standpoint it’s a tricky one because there are so many varied use cases and ways of getting the click to fire (not to mention the sheer number of parameters that can be supplied to the article/article_custom tags) that it’d be a lot of hassle for minimal gain. Plus, once the article comes back it may have further links to other articles in it and clicking those wouldn’t trigger an AJAX call; potential confusion from a usability standpoint.

If all you want is to deliver articles from a list, my guess is a custom bit of PHP to output some jQuery for each item in the list would be the simplest way forward, but I’ve not thought it through enough to say that’s the best approach.

Last edited by Bloke (2007-12-13 19:21:57)

the_ghost · 2007-12-13 19:46:11

May be somebody can make plugin of that?

hakjoon · 2007-12-13 21:16:00

REST is your friend.

Assign articles to an “ajax” section (don’t need to actually call it ajax). The page for the section has not html or body tags just <txp:article />
Home page pulls articles from said section.
jQuery attaches a listener to each link which will call the Article URL via ajax and load it in DIV

If you want to get really fancy make it also work without Javascript

Check out Mattthew’s article on zem_contact with Ajax the principles are similar.

diniscorreia · 2007-12-17 00:49:27

Thanks for all the tips.

@hakjoon, that sums pretty much what I want to do. I’ve found this other thread about using jQuery.

There’s also the dub_if_ajax plugin – that way, I can have a section with html and body tags if the page is not loaded via AJAX.

Ok, time to start working. I’ll post my results here :) Thanks!

hakjoon · 2007-12-17 16:02:22

I always thought a dub_if_not_ajax would be really useful. That way I could do

<txp:dub_if_not_ajax>
    <html>
    <head>
    </head>
     <body>
</txp:dub_if_not_ajax>
     </txp:article />
<txp:dub_if_not_ajax>
     </body>
     </html>
</txp:dub_if_not_ajax>

I since I normally want less stuff in the ajax call. I haven’t had a need for this yet though.

Slaktad · 2007-12-20 07:24:46

…or just use jQuery’s load()-method which let you specify what you want to load from the requested page. An example:

$("#content").load("http://www.mysite.com/mysection/myarticle #article");

This will load only the element with the ‘article’ id and it’s contents from the requested page into the ‘content’ id in the current page.

Check it out @ http://docs.jquery.com/Ajax/load
Be sure to use jQuery v1.2+.

Last edited by Slaktad (2007-12-20 07:35:56)

hakjoon · 2007-12-20 15:56:10

Oh that is sweet. Didn’t realize 1.2 added that.

Textpattern CMS

Textpattern CMS support forum

#1 2007-12-13 16:50:55

Loading articles via AJAX, anyone?

#2 2007-12-13 16:59:42

Re: Loading articles via AJAX, anyone?

#3 2007-12-13 19:20:28

Re: Loading articles via AJAX, anyone?

#4 2007-12-13 19:46:11

Re: Loading articles via AJAX, anyone?

#5 2007-12-13 21:16:00

Re: Loading articles via AJAX, anyone?

#6 2007-12-17 00:49:27

Re: Loading articles via AJAX, anyone?

#7 2007-12-17 16:02:22

Re: Loading articles via AJAX, anyone?

#8 2007-12-20 07:24:46

Re: Loading articles via AJAX, anyone?

#9 2007-12-20 15:56:10

Re: Loading articles via AJAX, anyone?

Board footer