You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@myfaces.apache.org by Stephen Friedrich <tr...@eekboom.com> on 2007/08/31 01:10:41 UTC

Desperate: Simple GUI with partial validation?

I have to implement lots of forms in the same style:
Wherever another entity is shown there is also a link that goes to another page
containing another form with the details of that entity. Did not look that
difficult when I first saw the sketches, but I have a hard time getting it to
work correctly.

See screenshot for my first cut at this and the code of the page at the bottom
of this message.

First of all I haven't been able to get validation work as desired:

- When the link "-->" is clicked
   * the dropdown must be validated (can't navigate to a person's details if
     no person is selected).
   * The project name field must not be validated (project isn't saved anyway)
- When "Save" button is clicked both project lead dropdown and project name
   field must be validated.

I tried various combinations of using subforms and/or immediate without success.
All I ever got was either validation of project name not working when I select
save or else working even when I select "-->" (or other errors like the
employee's id not transfered to the employee bean before navigation to the
employee details).

Any suggestions?

Also the layout is of course not that nice:

- How do I get the dropdown and text field aligned, with the required asterisk
showing before the "Project Lead" label? (Well, actually required asterisk
should be _after_ the label, but that's not that important right now).
I guesss I could make the dropdown simple and add a message tag myself, but that
complicates layout even further. Also how to get the required asterisk shown at
the label in that case.

I spent lots of hours on this and can't see a solution anywhere close, so any
help or suggestions are highly appreciated!

---------------------------------------------------------------------------------

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="trh" uri="http://myfaces.apache.org/trinidad/html" %>
<%@ taglib prefix="tr" uri="http://myfaces.apache.org/trinidad" %>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core" %>

<f:view>
	<trh:html>
		<trh:head/>
		<trh:body>
			<tr:form defaultCommand="saveButton">
				<tr:panelFormLayout>

					<tr:panelLabelAndMessage styleClass="inputLabel_10" label="Project Lead">
						<tr:panelHorizontalLayout>
							<tr:selectOneChoice required="true" value="#{project.selectedEmployeeId}">
								<f:selectItems value="#{project.allEmployees}"/>
							</tr:selectOneChoice>
							<tr:commandLink action="employee" text="-->">
								<tr:setActionListener from="#{project.selectedEmployeeId}" to="#{employee.id}"/>
							</tr:commandLink>
						</tr:panelHorizontalLayout>
					</tr:panelLabelAndMessage>

					<tr:inputText label="Project Name " required="true" value="#{project.projectName}"/>

					<tr:commandButton id="saveButton" text="Save" action="saved"/>
				</tr:panelFormLayout>
			</tr:form>
		</trh:body>
	</trh:html>
</f:view>


Re: Desperate: Simple GUI with partial validation?

Posted by Vadim Dmitriev <dm...@mail.ru>.
Hi.
You can try something like that (removed all EL's to test it locally):

        <tr:form defaultCommand="saveButton">
            <tr:panelFormLayout>

                <tr:subform default="true">
                    <tr:panelLabelAndMessage    for="projectLeadSelect"
styleClass="inputLabel_10"    label="Project Lead"
                                                showRequired="true" >
                        <tr:panelHorizontalLayout>
                            <tr:selectOneChoice id="projectLeadSelect"
                                                simple="true"
                                                required="true"
                                                unselectedLabel="" >
                            </tr:selectOneChoice>
                            <tr:commandLink action="employee" text="-->" />
                        </tr:panelHorizontalLayout>
                    </tr:panelLabelAndMessage>
                </tr:subform>
                <tr:subform default="true">
                    <tr:inputText label="Project Name " required="true" />
                </tr:subform>

                <tr:commandButton id="saveButton" text="Save"
action="saved" />
            </tr:panelFormLayout>
        </tr:form>
       
Note, that if selectOne's unselectedLabel will be other than empty
string and it will be the only option in select element, then
selectOneChoice will be validated only on server side.
Assume both inputs are empty. In that case on form submit via button
only inputText will be marked as invalid, and only when it will pass
validation - selectOneChoice will be processed (server-side).

As for "required" mark placement, I guess one of the options is to
implement your own renderer for panelFormLayout.

Hope it helps.


Stephen Friedrich wrote:
> I have to implement lots of forms in the same style:
> Wherever another entity is shown there is also a link that goes to
> another page
> containing another form with the details of that entity. Did not look
> that
> difficult when I first saw the sketches, but I have a hard time
> getting it to
> work correctly.
>
> See screenshot for my first cut at this and the code of the page at
> the bottom
> of this message.
>
> First of all I haven't been able to get validation work as desired:
>
> - When the link "-->" is clicked
>   * the dropdown must be validated (can't navigate to a person's
> details if
>     no person is selected).
>   * The project name field must not be validated (project isn't saved
> anyway)
> - When "Save" button is clicked both project lead dropdown and project
> name
>   field must be validated.
>
> I tried various combinations of using subforms and/or immediate
> without success.
> All I ever got was either validation of project name not working when
> I select
> save or else working even when I select "-->" (or other errors like the
> employee's id not transfered to the employee bean before navigation to
> the
> employee details).
>
> Any suggestions?
>
> Also the layout is of course not that nice:
>
> - How do I get the dropdown and text field aligned, with the required
> asterisk
> showing before the "Project Lead" label? (Well, actually required
> asterisk
> should be _after_ the label, but that's not that important right now).
> I guesss I could make the dropdown simple and add a message tag
> myself, but that
> complicates layout even further. Also how to get the required asterisk
> shown at
> the label in that case.
>
> I spent lots of hours on this and can't see a solution anywhere close,
> so any
> help or suggestions are highly appreciated!
>
> ---------------------------------------------------------------------------------
>
>
> <%@ page contentType="text/html;charset=UTF-8" language="java" %>
> <%@ taglib prefix="trh" uri="http://myfaces.apache.org/trinidad/html" %>
> <%@ taglib prefix="tr" uri="http://myfaces.apache.org/trinidad" %>
> <%@ taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
>
> <f:view>
>     <trh:html>
>         <trh:head/>
>         <trh:body>
>             <tr:form defaultCommand="saveButton">
>                 <tr:panelFormLayout>
>
>                     <tr:panelLabelAndMessage
> styleClass="inputLabel_10" label="Project Lead">
>                         <tr:panelHorizontalLayout>
>                             <tr:selectOneChoice required="true"
> value="#{project.selectedEmployeeId}">
>                                 <f:selectItems
> value="#{project.allEmployees}"/>
>                             </tr:selectOneChoice>
>                             <tr:commandLink action="employee" text="-->">
>                                 <tr:setActionListener
> from="#{project.selectedEmployeeId}" to="#{employee.id}"/>
>                             </tr:commandLink>
>                         </tr:panelHorizontalLayout>
>                     </tr:panelLabelAndMessage>
>
>                     <tr:inputText label="Project Name "
> required="true" value="#{project.projectName}"/>
>
>                     <tr:commandButton id="saveButton" text="Save"
> action="saved"/>
>                 </tr:panelFormLayout>
>             </tr:form>
>         </trh:body>
>     </trh:html>
> </f:view>
>
>
>
>
> __________ NOD32 2493 (20070831) Information __________
>
> This message was checked by NOD32 antivirus system.
> http://www.eset.com
>
> ------------------------------------------------------------------------
>