[PHPTAL] ajax attributes

[Jack Bates]

I'm interested in some AJAX attributes, to simplify template authors'
job of writing AJAX behavior. Does such thing already exist?

I've been working on some Smarty functions for this purpose, but found
Smarty awkward for describing the behaviors I intend. So far I'm very
impressed with PHPTAL: The model of attributes lends itself to exactly
what I'm trying to describe and the coding is impeccable.

The attributes I was thinking of are:

* ajax:content - to update the element content on AJAX callback
  requests.
* ajax:attributes - like i18n:attributes: list of attributes to update
  on AJAX callback requests.
* ajax:display - a condition which, if false, sets the display CSS
  parameter to "none". Renders JavaScript to hide / show the element on
  AJAX callback requests.
* ajax:toggle - id of an element to attach an onClick (or other event)
  listener which, when fired, hides / shows this element.
* ajax:script - the enclosed JavaScript is appended to an AJAX response.

If such things don't already exist, I'm interested in working on them. I
would create a Namespace with methods which could be overridden
depending on the JavaScript library (we're using YUI). I was thinking
of something like:

* isAjaxRequestCode - to return PHP code which checks if the current
  request is an AJAX callback.
* updateContentCode - to return PHP code which renders JavaScript to
  update this element's innerHTML.
* updateAttributeCode - code to render JavaScript which updates this
  element's attributes.
* toggleCode - render JavaScript which attaches an event listener to
  another element.
* displayCode - render JavaScript to hide / show this element depending
  on the evaluated condition.

Example usage would be:

<script ajax:script="">
  YAHOO.util.Dom.setStyle("myId", "opacity", ${opacity});
</script>

This template should not render the script element if this is not an
AJAX callback request, and not render anything except the script element
content if this is an AJAX callback request. Ideally it would also set
the Content-Type response header to text/javascript. The idea is
template authors can embed in their templates JavaScript which is
returned and evaluated with AJAX responses.

---

<h2 ajax:content=""> ${title} </h2>

If this is not an AJAX callback and ${title} is "Knowledge", this
template should render:

<h2 id="someId"> Knowledge </h2>

If this is an AJAX callback and ${title} is now "Power", this template
should not render any HTML and instead append to the JavaScript response
(in our YUI case):

YAHOO.util.Dom.get("someId").innerHTML = "Power";

---

<input name="serialNumber" type="hidden" value="${serialNumber}" ajax:attributes="value">

Like above, if not AJAX and ${serialNumber} = 7, render:

<input id="someId" name="serialNumber" type="hidden" value="7">

If AJAX and ${serialNumber} now = 8, render no HMTL, instead append to
JavaScript response:

YAHOO.util.Dom.get("someId").value = 8;

---

<div ajax:toggle="otherId">
[...]
</div>
<a id="otherId">

Strictly, this is just JavaScript, not AJAX, so if this is an AJAX
request it renders nothing. Normally it renders:

<div id="someId">
[...]
</div>
<script>
// <![CDATA[

YAHOO.util.Event.addListener("otherId", "click", function(event) {
    element = YAHOO.util.Dom.get("someId");
    if (element.style.display) {
      element.style.display = "none";
    } else {
      element.style.display = "";
    }
  });

// ]]>
</script>
<a id="otherId">

---

<div ajax:display="php:!empty(error)">

Finally, if not an AJAX request and error is indeed empty, this template
should render:

<div id="someId" style="display: none">

Same thing without the style attribute if error is set. This guarantees
the div will be hidden if error is empty, even if JavaScript is
disabled.

If this is an AJAX request, it should render no HTML and instead append
to the JavaScript response:

YAHOO.Dom.get("someId").style.display = "none"; // Or = ""; depending on php:!empty(error)

---

As I say, I'm so far very impressed with PHPTAL. TAL seems like a very
clean language. Thank you PHPTAL authors! I appreciate your feedback, if
a TAL AJAX solution already exists, or your opinion of these attributes.

Thanks! Jack
-------------- next part --------------
A non-text attachment was scrubbed...
Name: not available
Type: application/pgp-signature
Size: 242 bytes
Desc: Digital signature
Url : http://lists.motion-twin.com/pipermail/phptal/attachments/20070809/63d339cc/attachment.pgp