Re : T5 actionlink, ajax zone and user onclick handler

[Julien HENRY <he...@yahoo.fr>]

Hi,

Instead of trying to deal with onclick html attribute you should use DOM lvl 2 events:
http://www.prototypejs.org/api/event/observe

The following JavaScript should work (not tested):

Event.observe($('deleteLink'), 'click', function(event) {confirm('are you sure to delete this
record ?')});

Regards

Julien

----- Message d'origine ----
De : Luca Fossato <lu...@gmail.com>
À : users@tapestry.apache.org
Envoyé le : Mercredi, 16 Avril 2008, 19h27mn 24s
Objet : T5 actionlink, ajax zone and user onclick handler

Hi all,

I'm playing with actionlink and zones to understand T5 ajax functions
(Tapestry 5.0.11).
I'd like to define an actionlink like this one:

<t:actionlink t:id="deleteLink" context="myContext"
t:zone="zoneToUpdate" onclick="confirm('are you sure to delete this
record ?');">delete</t:actionlink>

where the onclick handler uses a javascript confirmation dialog to ask
to the user if he/she wants to delete the selected record.
It seems to me the Tapestry.linkZone js function "eats" the user
onclick handler and set its own - so it is not possible to execute any
js code prior to invoke the ajax call.

Is it correct or am I missing something ?

I tried to "fix" this behaviour, modifying a bit the Tapestry.linkZone
function (just an experiment):

--- cut here ---

/** Convert a form or link into a trigger of an Ajax update that
 * updates the indicated Zone.
 */
linkZone : function(element, zoneDiv)
{
  // ... original code until "Otherwise, assume it's just an ordinary
link." comment...

  // Otherwise, assume it's just an ordinary link.
  var onClickValue = element.getAttribute("onclick");
  if (onClickValue != null)
  {
    element.setAttribute("tapestry5_onbeforeajax",  onClickValue);
  }

  var handler = function(event)
  {
      var onBeforeAjaxRes = true;
      var onBeforeAjaxValue = element.getAttribute("tapestry5_onbeforeajax");
      if (onBeforeAjaxValue != null)
      {
        onBeforeAjaxRes = eval(onBeforeAjaxValue);
      }

      // execute the Ajax request only if the original onclick
attribute was not set or if the evaluation
      // of the related function returned true;
      if (onBeforeAjaxRes === undefined || onBeforeAjaxRes)
        new Ajax.Request(element.href, { onSuccess : successHandler });

      return false;
  };

  element.onclick = handler;
},  // end of linkZone function

--- cut here ---

that is a 10 minutes "fix", so probably it's not the best solution.
Anyway it seems to work fine for my experiment ;^)
To block the execution of the ajax call, do NOT use a return statement
inside the onclick handler. Example:

<t:actionlink t:id="deleteLink" t:zone="zoneToUpdate" onclick="return
myFunction(myParam);">delete</t:actionlink>

use this instead:

<t:actionlink t:id="deleteLink" t:zone="zoneToUpdate"
onclick="myFunction(myParam);">delete</t:actionlink>

because eval() returns the value of the last expression evaluated.
http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Functions:eval

Does this stuff make sense for you ?? ;^)

Thank you,
Luca Fossato

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org







      _____________________________________________________________________________ 
Envoyez avec Yahoo! Mail. Une boite mail plus intelligente http://mail.yahoo.fr