001// Licensed under the Apache License, Version 2.0 (the "License"); 002// you may not use this file except in compliance with the License. 003// You may obtain a copy of the License at 004// 005// http://www.apache.org/licenses/LICENSE-2.0 006// 007// Unless required by applicable law or agreed to in writing, software 008// distributed under the License is distributed on an "AS IS" BASIS, 009// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 010// See the License for the specific language governing permissions and 011// limitations under the License. 012 013package org.apache.tapestry5.corelib.mixins; 014 015import org.apache.tapestry5.Field; 016import org.apache.tapestry5.MarkupWriter; 017import org.apache.tapestry5.SymbolConstants; 018import org.apache.tapestry5.ValidationDecorator; 019import org.apache.tapestry5.annotations.Environmental; 020import org.apache.tapestry5.annotations.HeartbeatDeferred; 021import org.apache.tapestry5.annotations.InjectContainer; 022import org.apache.tapestry5.dom.Element; 023import org.apache.tapestry5.ioc.annotations.Inject; 024import org.apache.tapestry5.ioc.annotations.Symbol; 025 026/** 027 * Applied to a {@link org.apache.tapestry5.Field}, this provides the outer layers of markup to correctly 028 * render text fields, selects, and textareas using Bootstrap: 029 * an outer {@code <div class="field-group">} containing a {@code <label class="control-label">} and the field itself. 030 * Actually, the class attribute of the div is defined by the 031 * {@link SymbolConstants#FORM_GROUP_WRAPPER_CSS_CLASS} and 032 * the class attribute of label is defined by the {@link SymbolConstants#FORM_GROUP_LABEL_CSS_CLASS}. 033 * <code>field-group</code> and <code>control-label</code> are the default values. 034 * As with the {@link org.apache.tapestry5.corelib.components.Label} component, the {@code for} attribute is set (after the field itself 035 * renders). 036 * 037 * 038 * You can also use the {@link SymbolConstants#FORM_GROUP_FORM_FIELD_WRAPPER_ELEMENT_NAME} symbol 039 * to optionally wrap the input field in an element and {@link SymbolConstants#FORM_GROUP_FORM_FIELD_WRAPPER_ELEMENT_CSS_CLASS} 040 * to give it a CSS class. This is useful for Bootstrap form-horizontal forms. 041 * Setting {@link SymbolConstants#FORM_GROUP_FORM_FIELD_WRAPPER_ELEMENT_NAME} to <code>div</code>, 042 * {@link SymbolConstants#FORM_GROUP_FORM_FIELD_WRAPPER_ELEMENT_CSS_CLASS} to <code>col-sm-10</code> 043 * and {@link SymbolConstants#FORM_GROUP_LABEL_CSS_CLASS} to <code>col-sm-2</code> 044 * will generate labels 2 columns wide and form fields 10 columns wide. 045 * 046 * 047 * This component is not appropriate for radio buttons or checkboxes as they use a different class on the outermost element 048 * ("radio" or "checkbox") and next the element inside the {@code <label>}. 049 * 050 * 051 * @tapestrydoc 052 * @since 5.4 053 * @see SymbolConstants#FORM_GROUP_WRAPPER_CSS_CLASS 054 * @see SymbolConstants#FORM_GROUP_FORM_FIELD_WRAPPER_ELEMENT_NAME 055 * @see SymbolConstants#FORM_GROUP_FORM_FIELD_WRAPPER_ELEMENT_CSS_CLASS 056 * @see SymbolConstants#FORM_GROUP_LABEL_CSS_CLASS 057 * @see SymbolConstants#FORM_FIELD_CSS_CLASS 058 */ 059public class FormGroup 060{ 061 @InjectContainer 062 private Field field; 063 064 @Inject 065 @Symbol(SymbolConstants.FORM_GROUP_LABEL_CSS_CLASS) 066 private String labelCssClass; 067 068 @Inject 069 @Symbol(SymbolConstants.FORM_GROUP_WRAPPER_CSS_CLASS) 070 private String divCssClass; 071 072 @Inject 073 @Symbol(SymbolConstants.FORM_GROUP_FORM_FIELD_WRAPPER_ELEMENT_NAME) 074 private String fieldWrapperElementName; 075 076 @Inject 077 @Symbol(SymbolConstants.FORM_GROUP_FORM_FIELD_WRAPPER_ELEMENT_CSS_CLASS) 078 private String fieldWrapperElementCssClass; 079 080 private Element label; 081 082 private Element fieldWrapper; 083 084 @Environmental 085 private ValidationDecorator decorator; 086 087 void beginRender(MarkupWriter writer) 088 { 089 writer.element("div", "class", 090 !("form-group".equals(divCssClass)) ? ("form-group" + " " + divCssClass) : divCssClass); 091 092 decorator.beforeLabel(field); 093 094 label = writer.element("label", "class", labelCssClass); 095 writer.end(); 096 097 fillInLabelAttributes(); 098 099 decorator.afterLabel(field); 100 101 if (fieldWrapperElementName.length() > 0) { 102 fieldWrapper = writer.element(fieldWrapperElementName); 103 if (fieldWrapperElementCssClass.length() > 0) { 104 fieldWrapper.attribute("class", fieldWrapperElementCssClass); 105 } 106 } 107 108 } 109 110 @HeartbeatDeferred 111 void fillInLabelAttributes() 112 { 113 label.attribute("for", field.getClientId()); 114 label.text(field.getLabel()); 115 } 116 117 void afterRender(MarkupWriter writer) 118 { 119 if (fieldWrapper != null) { 120 writer.end(); // field wrapper 121 } 122 writer.end(); // div.form-group 123 } 124}