XML question: Interactivity

[The Serpent webforumsuser@macromedia.com]

Hi guys

Not quite sure if this is the correct forum to post this, so mods can feel free to move this to another suitable forum if they want to.

Ok, now on to my question: I am new to XML and I have some problems with some of the concepts involved. Just say for the sake of discussion, I have a simple xml file like this with an appropriate dtd like this [I am not showing all the code]

<employee>
<firstname>Harry</firstname>
<lastname>Potter</lastname>
</employee>

Then, I can use XSLT to transform the above into something like:

<table>

<tr>
<td>First Name</td>
<td>Harry</td>
</tr>

<tr>
<td>Last Name</td>
<td>Potter</td>
</tr>

</table>

Ok, thats all fine. Now, what if I want to add interactivity to the page: say when the user mouseover the first name, the cell should change color --- how do I do something like that? Do I build the behaviour functions in the XSLT as well so that the code is something like this:

..
..
..
<tr>
<td onmouseover="changeColor();">First Name</td>
..
..

Thats my conceptual problem at the moment? Is the behaviour meant to be separate from presentation and structure as well? or do I mix the presentation and behaviour but keep it separate from the structure? I will really appreciate your help If anyone can point me to some resources on how to add interactivity to xml based web pages.

Thank you

[Code Ronin]

"The Serpent" [email]webforumsuser@macromedia.com[/email] wrote in message news:<bl2skq$pjl$1@forums.macromedia.com>...

> Then, I can use XSLT to transform the above into something like:
>
> <table>
>
> <tr>
> <td>First Name</td>
> <td>Harry</td>
> </tr>
>
> <tr>
> <td>Last Name</td>
> <td>Potter</td>
> </tr>
>
> </table>

Well, as you are asking about concepts, your transformation should us
<th> for the First Name and Last Name cells. This conveys that the
information is a "header" and not a data cell. For a discussion on why
you want to do that, see
[url]http://www.evolt.org/article/Building_accessible_tables/4090/42090/index.html[/url].

> Ok, thats all fine. Now, what if I want to add interactivity to the page: say
> when the user mouseover the first name, the cell should change color --- how
> do I do something like that?

Well, you have chosen a simple interactivity example. I am not sure if
that was intended. But, another option is to apply CSS styles to the
cell to achieve the effect you want -- all without JavaScript. Google
on "css mouseover" to get an idea of how to do what you want.

> Do I build the behaviour functions in the XSLT as well so that the code is something like this:
> <tr>
> <td onmouseover="changeColor();">First Name</td>

Good question. Personally, I believe in separating the content and the
presentation as much as possible. Normally, that means applying CSS
styles, but if you find that the interactivity is more complex, you
need to use script. Rather than "embedding code" into the HTML, you
can separate it, like so:

function init ( ) {
// ... write code to get the <table>
// ... write code to loop through the <table>
// ... apply to each cell that needs the mouseover effect
cell.onmouseover = handleMouseOverDoWhatever;
// ... other initialization code
}

function handleMouseOverDoWhatever ( event ) {
// ... event handling code goes here
}

As for the XSLT, you can either include the <link> reference in the
HTML generation -- if you choose CSS to solve your problem -- or
include the <script src="..."> reference.

In either case, leave the CSS and script in external files and your
XSLT will be simpler and shorter.

> Is the behaviour meant to be separate from presentation and structure as well?

"Meant to be" is a subjective term. There is little to be gained by
keeping it together and more to be gained (organizationally) by
separating it. Also, by separating it, you increase the chance of
reuse. Further, if you decide to make a change to the common portion,
if it is embedded into multiple XSLT files, you will have to find and
change all such instances.

> on how to add interactivity to xml based web pages.

Ultimately, if you decide to embed scripts in your XSLT, you will have
to use the <![CDATA[ ]]> wrapper around your code, so that < and >
will not be misinterpreted, such as in a JavaScript statement:

if ( x >= 1 ) {

Hope that helps.

[Zvika Gur-Esh]

Yes, add the function caller within the XSLT, as any other HTML elements.

If you would like read more about XML, I've posted few small tutorials in:
[url]news://ls.magicbeat.com/magicbeat_xml[/url]

--
Zvika Gur-Esh
Programmer
<?.........?>
--