Visual Web JSF Component Tasks: Quick Reference

See Also

This topic describes common tasks that you can perform with components. For more detailed information, click the links in the right column.

To perform this task... Follow these steps
Add a binding attribute to a JSF component
  1. Right-click the component.
  2. Choose Add Binding Attribute.
Add a component to a Visual Web JSF page
  1. Ensure that the page is open in the
  2. In the select the type of component to add by clicking the corresponding category.
  3. Double-click the component or drag the component to the Visual Designer and drop it.
Add a category to the palette
  1. If necessary, open the by choosing Window > Palette.
  2. Right-click any category and choose Create New Category.
  3. In the New Palette Category dialog box, enter a name for the category.
Add a table
Add, use, change, rename, or delete code clips
Align components
  1. In the hold down the Shift key and select the components to align.
  2. Right-click the last component selected and choose Align > alignment-command.
Bind default component property
  1. Right-click the component you want to bind and choose Bind to Data.
  2. In the Bind to Data dialog box, choose whether to bind to an object or bind to a data provider.
  3. Choose the target to which you want to bind the property.
Bind general component properties
  1. Right-click the component you want to bind and choose Property Bindings.
  2. In the Property Bindings dialog box, choose the property to which you want to bind from the list on the left side.
  3. Choose the target to which you want to bind the property from the list on the right side.
Delete a component from a Visual Web JSF page
  1. In the or select the component to delete.
  2. Right-click the component and choose Delete.
Remove a component library
Edit component CSS styles (change appearance of a component on a page)
  1. In the click the component.
  2. In the Properties window, click the ellipsis button (...) next to the style property.

    The Style Editor opens.

  3. Choose categories from the list on the left side of the editor.
  4. Set the styles for the categories that you want to apply to the component.
  5. Review the changes to the component in the Visual Designer.
  6. Click OK to apply all the settings to the component's style property.
Edit a style sheet
  1. In the   under the project-name > Web Pages > resources node, double-click stylesheet.css (the default style sheet) or any other CSS file in the directory.
  2. In the CSS Editor, edit the style sheet.
  3. From the main menu, choose File > Save.
Handle component events
  1. In the click the Java button in the editor toolbar.
  2. Add the Java code for your event handler to the methods.

    As you type, the Java Editor offers suggestions for code completion, including potential methods and instance variables for objects you refer to.

  3. You can also position the cursor on an item for which you need information and type Ctrl-Shift-Space to view Javadoc documentation.
Import new components
Nest components
  • In the drag the component on top of the component in which it should nest.
Preview pages
Remove a binding attribute from a JSF component
  1. Right-click the component.
  2. Choose Remove Binding Attribute.
Select a single component
  • In the or in the click the component.
Select multiple components

There are several techniques:

  • In the or in the click each component while holding down the Control key.
  • In the Navigator window, click the first item in the list, then hold down the shift key and click the last item in the list. All components in between are selected.
  • In the Visual Designer, click and hold the mouse button down, then drag the mouse to enclose fully all the items to select.
Set component properties
  1. In the or in the select the component.
  2. In the Properties window, set the properties.
Set CSS styles
  1. In the click the component.
  2. In the Properties window, click the ellipsis button (...) next to style.
  3. Choose a Style Editor category from the list on the left side of the editor.
  4. Select style settings related to the category to the right of the list of categories.
  5. When you have finished, click OK to apply the styles.
Set page layout
  1. In the click the page background so you can see the Page properties.
  2. In the Properties window, select the value for Page Layout.
Set tab order
  1. In the or the select the component.
  2. In the Properties window find the tabindex property under the Accessibility section and enter the tab index number.
Set the grid
  1. Choose Tools > Options on Microsoft Windows or UNIX systems, or choose NetBeans > Preferences on Macintosh systems.
  2. Click Miscellaneous tabons button and then the Visual Web tab.
  3. Enter the new Grid Height and Grid Width in the corresponding field. Use the checkboxes to set whether to Show Grid or Snap to Grid..
Snap components to the grid
  1. In the select the item.
  2. Right-click and choose Snap To Grid.
Stack components
Use a style sheet
  1. In the click the page.
  2. In the Properties window, click the ellipsis button (...) next to Style Sheet.
  3. Enter the file name and location.
View a page at different resolutions
View and zoom an image
  1. In the double-click an image to display it in the editor.
  2. Use the toolbar that appears in the editor to enlarge or shrink the image.
See Also
About Components
Working With Components

Legal Notices