users@woodstock.java.net

Hide/Show components asynchronously

From: Gea Pastetti <alucard___at_hotmail.it>
Date: Mon, 21 Jan 2008 12:37:43 +0100

Hi all!

It's my first post in this mailing list and I profit by the occasion to greet the community.
I'm developing a web application with JSF, using Netbeans6, VWP and Woodstock components.
I would like that whan we click a button, a input data form (labels and textFields within a panelGroup ) appears without a full reload of the page, using Ajax.
I tried ajaxZone and ajaxTransaction but they don't work probably because of bugs with dojo.
I also tried using a4j and richfaces but the visual builder crashes.
I haven't a thorough knowledge of javascript and looking at the tag library examples I wrote this...

Page1.jsp

[CODE]
<jsp:root version="2.1" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:jsp="http://java.sun.com/JSP/Page" xmlns:webuijsf="http://www.sun.com/webui/webuijsf">
    <jsp:directive.page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"/>
    <f:view>
        <webuijsf:page binding="#{Page1.page1}" id="page1">
            <webuijsf:html binding="#{Page1.html1}" id="html1">
                <webuijsf:head binding="#{Page1.head1}" id="head1">
                    <webuijsf:link binding="#{Page1.link1}" id="link1" url="/resources/stylesheet.css"/>
                    <f:verbatim><![CDATA[
                        <script type="text/javascript">
                            function showPanel(b) {
                                var panel = document.getElementById('form1:groupPanel1');
                                panel.setProps({visible: b});
                                var hidden = document.getElementById('form1:hiddenField1');
                                if (b)
                                    hidden.setProps({value: 'true'});
                                else
                                    hidden.setProps({value: 'false'});
                            }
                        </script>
                        ]]></f:verbatim>
                </webuijsf:head>
                <webuijsf:body binding="#{Page1.body1}" id="body1" style="-rave-layout: grid">
                    <webuijsf:form binding="#{Page1.form1}" id="form1">
                        <webuijsf:panelGroup binding="#{Page1.groupPanel1}" id="groupPanel1" style="position: absolute; left: 72px; top: 96px" visible="#{Page1.showPanel}">
                            <h:panelGrid binding="#{Page1.gridPanel1}" columns="2" id="gridPanel1">
                                <webuijsf:label binding="#{Page1.label1}" id="label1" text="Label"/>
                                <webuijsf:textField binding="#{Page1.textField1}" id="textField1"/>
                            </h:panelGrid>
                        </webuijsf:panelGroup>
                        <webuijsf:button binding="#{Page1.button1}" id="button1" onClick="javascript:
                        showPanel('true');
                        return true;"
                            style="position: absolute; left: 96px; top: 24px" text="show"/>
                        <webuijsf:hiddenField binding="#{Page1.hiddenField1}" id="hiddenField1" text="#{Page1.showPanel}"/>
                        <webuijsf:button binding="#{Page1.button2}" id="button2" onClick="javascript:
                        showPanel('false');
                        return true;"
                        style="position: absolute; left: 192px; top: 24px" text="hide"/>
                    </webuijsf:form>
                </webuijsf:body>
            </webuijsf:html>
        </webuijsf:page>
    </f:view>
[/CODE]

This is the backing bean

[CODE]
public class Page1 extends AbstractPageBean {
...
private boolean showPanel = false;
public boolean isShowPanel() {
        return showPanel;
    }
public void setShowPanel(boolean showPanel) {
        this.showPanel = showPanel;
    }
...
}
[/CODE]

When I click a button, the page is submitted and reloaded without changes.

I tried using <webuijsf:script> tag instead of <f:verbatim> but doesn't work.
I also tried return false in the onClick event but doesn't work.

Any idea??
Thanks in advance for your attention.
Regards.

jettero.

_________________________________________________________________
Ti piace giocare con le lettere? Prova ABCLive!
http://messengergiochi.it.msn.com/