views:

273

answers:

2

Hello

This should be a very simple question. I have a richfaces tree that is rendered using JSF. When the user clicks on a node I want a javascript function to run. Nothing more nothing less. No redirects, no re-submit, no-rerender, no Ajax. Just plain old Javascript.

I have seen the onselected attribute of the tree and it indeed fires a Javascript method. But of course I want to know which node was clicked.

Here is what I have so far

<head>
<script type="text/javascript">
function documentClicked(nodeRef)
{
    alert("Node is "+nodeRef);
}

</script>
</head>


    <rich:tree switchType="client" value="#{ajaxDocumentTree.rootNode}"  
        var="document" onselected="documentClicked()" >



        <rich:treeNode   iconLeaf="../images/tree/doc.gif"
            icon="../images/tree/doc.gif">

            <h:outputText value="#{document.friendlyName}" />

        </rich:treeNode>

But this does not work because nodeRef is undefined. I expected that the first argument of the callback would be the selected node but this is not the case.

So the question is this:

How do I fire a Javascript function with the selected node from a richfaces tree?

A: 
Peter Jaric
I thought the same thing! I have already tried it. "This" refers to the whole browser window and not the selected node.
kazanaki
Do you have a public URL to your test page? I am really suspicious towards these Java/JSF-to-JavaScript frameworks. Probably because I don't know them well, but it would help very much to see what kind of JS-code was generated in the end. Then we can see how documentClicked actually is called, in reality.
Peter Jaric
OK, I am being stupid, it's obvious from your code how documentClicked is called. Keep your original function and call it in onselected like this: documentClicked(this).
Peter Jaric
+1  A: 

The answer is that the javascript code should be on the node level instead of the tree level.

<head>
<script type="text/javascript">
function documentClicked(nodeRef)
{
    alert("Node id is "+nodeRef);
}

</script>
</head>


    <rich:tree switchType="client" value="#{ajaxDocumentTree.rootNode}"  
        var="document" >

        <rich:treeNode onclick="documentClicked('#{document.id}')">

            <h:outputText value="#{document.friendlyName}" />

        </rich:treeNode>
kazanaki