THIS IS A TEST INSTANCE. ALL YOUR CHANGES WILL BE LOST!!!!
...
This
...
page
...
is
...
intended
...
for
...
WW
...
developer
...
not
...
for
...
WW
...
users.
...
If
...
your
...
a
...
user
...
of
...
WW
...
hopefully
...
you
...
dont
...
need
...
to
...
know
...
these
...
details,
...
but
...
certainly
...
more
...
knowledge
...
is
...
better,
...
so
...
if
...
your
...
hungry
...
eat
...
up!
...
The
...
WW
...
ajax/dhtml
...
components
...
use
...
the
...
DOJO
...
Toolkit
...
for
...
both
...
javascript
...
event
...
handling
...
and
...
AJAX
...
calls.
...
To
...
understand
...
the
...
widget
...
framework
...
this
...
page
...
is
...
a
...
must
...
read:
...
http://dojotoolkit.org/docs/fast_widget_authoring.html
...
To
...
understand
...
the
...
dojo
...
event
...
framework
...
which
...
is
...
used
...
extensively
...
by
...
the
...
widget
...
framework
...
read
...
this:
...
http://dojotoolkit.org/docs/dojo_event_system.html
...
OK
...
Great
...
so
...
your
...
smart
...
on
...
DOJO
...
Widgets
...
and
...
DOJO
...
Events
...
lets
...
see
...
how
...
WW
...
uses
...
these.
...
Lets
...
start
...
with
...
looking
...
at
...
what
...
a
...
user
...
of
...
WW
...
would
...
include
...
in
...
their
...
page,
...
a
...
JSP
...
in
...
this
...
case:
| Code Block | ||
|---|---|---|
| ||
title:Some happy jsp} <ww:a id="link1" theme="ajax" href="/AjaxRemoteLink.action" showErrorTransportText="true" errorText="An Error ocurred">Update</ww:a> |
This is just a standard WW component. All the attributes defined here must map to a component class thats defined in the taglib.tld. Were not going to go into how the WW componets work in this discussion, just be assured that nothing different happens here.
Now lets look at what this snippet of code would generate for us in html:
| Code Block | ||
|---|---|---|
| ||
<a dojoType="BindAnchor" evalResult="true" id="link1" href="/ajax/AjaxRemoteLink.action" errorHtml="An Error ocurred" showTransportError="true">Update</a> |
Lets review this file. The dojoType type tells the dojo parser what to do with this tag. This is going to need to correspont to a call in our widge file like:
dojo.widget.tags.addParseTreeHandler("dojo:BindAnchor");
All the other attributes are basically passthrough from our component code to our widget code. No real magic happening w/ them.
Next up lets look at some snippets of the widget file:
| Code Block | ||
|---|---|---|
| ||
webwork.widgets.HTMLBindAnchor = function() { //lots removed for clarity this.widgetType = "BindAnchor"; {code} this.templatePath = dojo.uri.dojoUri("webwork/widgets/BindAnchor.html"); //lots removed self.anchor.href = "javascript:{}"; dojo.event.kwConnect({ srcObj: self.anchor, srcFunc: "onclick", adviceObj: self, adviceFunc: "bind", adviceType: 'before' }); //snippet removed } } // make it a tag dojo.widget.tags.addParseTreeHandler("dojo:BindAnchor"); |