Advice about ajax and single page paradigm

[Roo]

Hi all,

Firstly I am no code guru. I came from an ASP scripting background and I am slowly getting my head around proper OOP using c# .net and javascript, so be patient!

People are expecting more and more that their shiny new website backends do lots of things without the page refreshing, and why not.

I have one particular page where there are about 10-15 actions which result in an ajax call and some update on the page.

Right now I am creating lots of individual ajax calls like this (sometimes using delegation as elements are squirted in and out);

$('element').addEvent('click', function(event){

event.stop (prevent default whatever is needed)

create request object

feed in the url

feed in the post data

create an oncomplete function

do whatever needs doing to the page

send request

});

This feels inefficient and there is lots of code reuse, but when I thought about abstracting some of it away into a custom class my knowledge fled and I couldnt think up anything much more efficient.

If I made a class it would have to receive the url, a post data object, and a callback function to jump to after it had completed..which means I'd still be typing out most of what I already do.

I imagine this is not an uncommon scenario and was wondering how the wizards handle lots of ajax calls on the same page, all of which may have subtly different behaviours.

Thanks

Rolf

[Sergio Crisostomo]

Hi Rolf,

 

Its difficult to help without seeing your code.

If you attach your page and script maybe someone will check it out and give some suggestions.

 

Cheers,

Sérgio

--

---
You received this message because you are subscribed to the Google Groups "MooTools Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mootools-user...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Roo]

Hi Sérgio

Here is a little JS Fiddle;

http://jsfiddle.net/g508zvq4/

This does no useful work but it illustrates the pattern. In this fiddle there are three possible actions that result in AJAX/Request calls which all do basically the same thing...do some database work then update the UI either by removing, adding or altering something.

In the real life cases I may have as many as 15 different actions possible on the page so I have 15 near (but not) identical chunks of JS code.

Thanks

Rolf

[Aicke Schulz]

Hi Rolf,

you may like to seperate events and function http://jsfiddle.net/g508zvq4/1/ and/or use a more structured way for your code http://jsfiddle.net/g508zvq4/3/. Creating a meta request object which handles every possible action might get too complicated.

Aicke