# RichFaces CDK Developer Guide

Gleb Galkin ggalkin@exadel.com
2008, 2009 Red Hat

PDF version

&intro; &roadmap; &setup;
inputDate component CDK Guide

## inputDate component development

We a going to create the <inputDate> component that can take a value, process that value, and then push it back to the underlying model as a strongly typed Date object.

The <inputDate> component allows to attach a converter in order to set the desired date format such as mm/dd/yyyy. So the component could convert and validate the date entered by user.

&pcreate; &ccreate; &protoui;
renderer UI CDK Guide

### Creating a Renderer

Component functionality typically centers around two actions: decoding and encoding data. Decoding is the process of converting incoming request parameters to the values of the component. Encoding is the process of converting the current values of the component into the corresponding markup. In the following figure you can see decoding and encoding occur in the JSF lifecycle:

Decoding and encoding in the JSF lifecycle

Thus, JSF components consist of two parts: the component class and the renderer. The component class is responsible for the state and behavior of a UI component and will be discussed later in the "Configuring component" section.

The Renderer is responsible for the JSF component representation. It generates the appropriate client-side markup, such as HTML, WML, XUL, etc. Renderer is also responsible for the converting information coming from the client to the proper type for the component (for example, a string value from the request is converted to a strongly type `Date` object).

It is necessary to create following renderer classes for the <inputDate> component:

- `InputDateRenderer` class where you should override `encode()` methods for encoding the markup and resources

- `InputDateRendererBase` class where you should override `decode()` method. You could also define associated converter in this class.

You could actually implement the renderer-specific component subclass that exposes client-side attributes such as "style" , "class" , etc. It is common practice to implement the client-specific component subclass to make some aspects of application development easier, but in our case we do not need to do it. The <inputDate> is a simple `UIInput` component, therefore `InputDateRenderer` class generates all the markup itself.

It is a time to start creating the `InputDateRenderer` class. The smartest way to create the `InputDateRenderer` class is a Templating mechanism, one of the most convenient features of the Component Development Kit (CDK).

&template; &rendererbase; &skin;
®ister; &ui; &ui_conf; &taghandler;
&overview; &devsample; &test; &ide; &namingconv;
template CDK Guide

## Template tags overview

&ajaxupdate; &cif; &cobject; &cset; &fattribute; &fclientid; &forEach; &fcall; &fparameter; &finsert; &fresource; &froot; &hscripts; &hstyles; &jspdeclaration; &jspdirectivepage; &jspscriptlet; &uinsertFacet; &vcpbody; &vcpmock;