Win a copy of Murach's Python Programming this week in the Jython/Python forum!
  • Post Reply Bookmark Topic Watch Topic
  • New Topic

Render radio buttons or checkboxes when a selectOneMenu option is clicked  RSS feed

 
fredy salgado
Greenhorn
Posts: 14
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I need to render radio buttons or checkboxes when the user selects one of the options from a select one menu. Also, when the user selects one of the options and the radio/checkboxes appear, the user must be able to insert as many radio buttons or checkboxes as he/she wants; like Google forms when you are creating a form.

How could I do it?
 
Tim Holloway
Bartender
Posts: 18531
61
Android Eclipse IDE Linux
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
JSF is based on the Model/View/Controller architecture. For collections of controls, you simply need a corresponding model.

A selectOneRadio control is a single element with multiple possible selections, only one of which may be selected at a time. In that sense, it's the same thing as the selectOneMenu dropdown list control, just with different control graphics. In both cases, your model is a collection of SelectItem sub-model objects. A SelectItem defines a displayed label and its corresponding value. You can create this collection for a given control by adding one or more "h:selectItem" and/or "h"selectItems" (note plural) child elements. Both operate the same, except that the selectItems element maps to an ordered collection (List or array) of SelectItems, where selectItem (singular) is backed by a single SelectItem object. You can also do brute-force SelectItem creation using the "itemLabel" and "itemValue" attributes, but that hard-codes the structure onto the View Template and you want something more flexible.

Here's how you can combine single and collection SelectItems using a selectOneMenu control as an example:


This displays a list with the "--- Make a selection ---" item set if no selection has been made yet. SInce "required=true" is set on the control, the form will not be accepted for processing until one of the items in selectItems list is chosen.

You can do the same thing using the "selectManyCheckbox" control.

To achieve what you want, add an f:ajax sub-element to the control that creates the list of possible selections and have it specify a "render="attribute value(s) for the ids of the checkbox and radio button control(s) you want updated. The Ajax listener can create the updated selection models, and the re-rendering option will then refresh the display showing those model values.
 
  • Post Reply Bookmark Topic Watch Topic
  • New Topic
Boost this thread!