The `<tc:in/>` tag may be extended with the facet tags `<f:facet name="before">` and `<f:facet name="after">`. With these, you can add text and dropdown menus to an input field.

The following example show how to add a text-label inside an input field.

<tc:in> <f:facet name="before">https://example.com/</f:facet> </tc:in> https://example.com/ <tc:in label="Price"> <f:facet name="after">.00 €</f:facet> </tc:in> .00 €

The following example show, how to add twice tc:out on one side in an input group

<tc:in id="values"> <f:facet name="before"> <tc:out id="firstName" value="#{groupController.firstName}"/> <tc:out id="lastName" value="#{groupController.lastName}"/> </f:facet> </tc:in>

Press the 'Send'-Button to add your message to the chat.

<tc:in value="\#{groupController.newMessage}"> ... <f:facet name="after"> <tc:button label="Send" action="\#{groupController.sendChat}"> <f:ajax execute="inewmessage" render="tachatlog"/> </tc:button> </f:facet> </tc:in> User Two

The following two examples show an input field with a dropdown element in front of. Pressing the "SendTo"-Button will display a selectable list. This list is different in the examples. Notice that the `omit` attribute is set for `<tc:link/>`.

Info It's recommended to use buttons instead of links for dropdown menus inside an input group.
When using a button, a dropdown menu is positioned under the input group. Otherwise the dropdown menu is set directly under the link.

<tc:in placeholder="type a message"> <f:facet name="before"> <tc:button id="lsendtoc" label="\#{groupController.sendTo}" omit="true"> <tc:command label="SendTo: Peter"> <f:ajax render="isendtoc" execute="isendtoc" listener="\#{groupController.sendToListener}"/> </tc:command> ... </tc:button> </f:facet> </tc:in> <tc:in id="isendtorb" placeholder="type a message"> <f:facet name="after"> <tc:button id="lsendtorb" label="\#{groupController.sendTo}" omit="true"> <tc:selectOneRadio value="\#{groupController.sendTo}"> <tc:selectItem itemValue="SendTo: Peter"/> ... <f:ajax render="isendtorb"/> </tc:selectOneRadio> </tc:button> </f:facet> </tc:in> Send To: Since Tobago 5.3.0 these facets can be used in `<tc:date>` Before After