Smutty

MVC Framework

SmuttyAjax

Smutty provides built-in support for adding ajax-goodness to your applications. At the moment this is quite simple, but already gives you enough to get going. Smutty uses scriptaculous to do this, and I plan to add support for many of it's great features like drag and drop to Smutty. (actually you can use all these features already, I just plan to make it easier by providing integration with Smutty).

Enabling Ajax Support

The only thing you need to do to enable Ajax support in your application is to include a call to the ajax_libs function in your pages header.

<html>
<head>
<title>My Page</title>

{ajax_libs}

</head>

This will then make sure all the required libraries are included with your page, and you're free to start using the functions outlined below.

Ajax Links

To create ajax links you use the same function as to create normal links, but this time just specify the update arrtibute to indicate that the action should update another page element, rather than loading a new page.

{link
    update="myDiv"
    url={ controller="foo" action="bar" }
    text="My Link"
}

This will then create a link with the text "My Link" that will call the bar action of the Foo controller. The output of this action will then be put in the page element with id myDiv.

NOTE: Smutty tries to keep names of things very standard, so you'll ind that to "ajaxify" things, you will always just need to specify the url and update attributes.

Ajax Forms

Smutty also makes it simple to submit forms via Ajax, again using the same form to as you can use to create normal forms, but this time supplying the update attribute to indicate the result should be loaded into another page element.

{form
    update="myDiv"
    url={ controller="foo" action="bar" }
}

    <-- form fields here  -->

{form_end}

Then, rather than the form submitting as normal, it's data will be sent to the url you specified, and the element with id myDiv will be updated with the results.

Live Fields

You can make fields "live" (meaning that when their value changes this will trigger an Ajax action) by just specifying the usual url and update attributes. This can be used to easily create things like live search.

{field
    url={ controller="search" action="live" }
    update="searchResults"
}

Drag and Drop

Smutty also provides an easy facility for using drag and drop with Ajax! You can see some demos of this on the demos page.

Links: Post a comment

Useful Pages

Links