SMARTY模板的AJAX插件扩展

sumi2005 2014-04-28

展开全文

分享到：
SMARTY模板的AJAX插件扩展

2006-11-14 15:01:00

归档在我的博文 | 浏览 940 次 | 评论 0 条

Today I’ve created simple AJAX-enabled plugins for Smarty. I don’t try to develop powerful reach-applications framework. I can give you only idea how to integrate AJAX-technology into Smarty. But if you have any offers how to improve anything I’ve described or if you just want to leave feedback please post you comments on my site.

In my practice I need several things from AJAX: to update some nodes in DOM, to send forms without post-back, to retrieve some values or to perform server-side calculation (maybe using database or other server-side resources). It’s necessary to write tons of JavaScript to implement my requirements in spite of using cool JavaScript library Prototype.

I’ve decided to integrate Smarty with AJAX. There are three Smarty plugins has been created: ajax_update, ajax_call, ajax_form. Below all this plugins will be described.

ajax_update

This Smarty function can be used for update some parts of web-page.

Sample usage:

<a href="#" onclick="{ajax_update update_id='intro_content'
  function='update_intro' params='page=about'}">About</a>

Possible parameters:

url - URL for AJAX-query (when no URL was specified current one will be used)
method - query method (by default get, can be get or post)
update_id - ID of HTML element for update
function - function which will be called
params - URL-encoded parameters

ajax_call

This Smarty function can be used for call PHP function on server side and retrieve its output.

Sample usage:

<a href="#" onclick="{ajax_call function='calculate'
  params_func='calc_params' callback='calc_cb'}">Calculate</a>

Possible parameters:

url - URL for AJAX-query (when no URL was specified current one will be used)
method - query method (by default get, can be get or post)
function - function which will be called
params - URL-encoded parameters
callback - JavaScript function which will be called when query will be completed
params_func - JavaScript function used when you need custom parameters calculated on client side

ajax_form

This Smarty block can be used for submit Web-forms without post-back.

Sample usage:

{ajax_form method="post" id="form_register"}
Any form-element can be placed here
{/ajax_form}

Possible parameters:

url - URL for AJAX-query (when no URL was specified current one will be used)
method - query method (by default get, can be get or post)
params - URL-encoded parameters
id - form ID
callback - JavaScript function which will be called when query will be completed

Samples

These plugins are quite simple and I think everyone can create even better than mine. I’ve just wanted to show you idea how integration can be done. Working examples can be found here. Also you can download full sources.