height: 16px;
display: block;
background: transparent url(../icons/16/error.png) no-repeat top right;
+}
+.i-formlayout-captioncell {
+ text-align:right;
+}
+.i-form-errormessage {
+ background: transparent url(../icons/16/error.png) no-repeat top left;
+ padding-left: 20px;
+ margin-bottom: 5px;
+ margin-top: 5px;
+ min-height: 20px;
+}
+
+* html .i-form-errormessage {
+ height: 20px
}
\ No newline at end of file
display: block;
background: transparent url(icons/16/error.png) no-repeat top right;
}
+.i-formlayout-captioncell {
+ text-align:right;
+}
+.i-form-errormessage {
+ background: transparent url(icons/16/error.png) no-repeat top left;
+ padding-left: 20px;
+ margin-bottom: 5px;
+ margin-top: 5px;
+ min-height: 20px;
+}
+
+* html .i-form-errormessage {
+ height: 20px
+}
.i-Notification {
font-family: "Trebuchet MS", geneva, helvetica, arial, tahoma, verdana, sans-serif;
public void updateFromUIDL(UIDL uidl) {
clear();
- for (final Iterator it = uidl.getChildIterator(); it.hasNext();) {
- final Object child = it.next();
- if (child instanceof String) {
- final String errorMessage = (String) child;
- add(new HTML(errorMessage));
- } else if (child instanceof UIDL.XML) {
- final UIDL.XML xml = (UIDL.XML) child;
- add(new HTML(xml.getXMLAsString()));
- } else {
- final ErrorMessage childError = new ErrorMessage();
- add(childError);
- childError.updateFromUIDL((UIDL) child);
+ if (uidl.getChildCount() == 0) {
+ add(new HTML(" "));
+ } else {
+ for (final Iterator it = uidl.getChildIterator(); it.hasNext();) {
+ final Object child = it.next();
+ if (child instanceof String) {
+ final String errorMessage = (String) child;
+ add(new HTML(errorMessage));
+ } else if (child instanceof UIDL.XML) {
+ final UIDL.XML xml = (UIDL.XML) child;
+ add(new HTML(xml.getXMLAsString()));
+ } else {
+ final ErrorMessage childError = new ErrorMessage();
+ add(childError);
+ childError.updateFromUIDL((UIDL) child);
+ }
}
}
}
\r
package com.itmill.toolkit.terminal.gwt.client.ui;\r
\r
-import com.google.gwt.user.client.ui.SimplePanel;\r
+import com.google.gwt.user.client.DOM;\r
+import com.google.gwt.user.client.Element;\r
+import com.google.gwt.user.client.ui.ComplexPanel;\r
import com.google.gwt.user.client.ui.Widget;\r
import com.itmill.toolkit.terminal.gwt.client.ApplicationConnection;\r
import com.itmill.toolkit.terminal.gwt.client.Container;\r
+import com.itmill.toolkit.terminal.gwt.client.ContainerResizedListener;\r
+import com.itmill.toolkit.terminal.gwt.client.ErrorMessage;\r
import com.itmill.toolkit.terminal.gwt.client.Paintable;\r
import com.itmill.toolkit.terminal.gwt.client.UIDL;\r
+import com.itmill.toolkit.terminal.gwt.client.Util;\r
\r
-public class IForm extends SimplePanel implements Paintable {\r
+public class IForm extends ComplexPanel implements Paintable,\r
+ ContainerResizedListener {\r
\r
public static final String CLASSNAME = "i-form";\r
\r
private Container lo;\r
+ private Element legend = DOM.createLegend();\r
+ private Element caption = DOM.createSpan();\r
+ private Element errorIndicatorElement = DOM.createDiv();\r
+ private Element desc = DOM.createDiv();\r
+ private Icon icon;\r
+ private ErrorMessage errorMessage = new ErrorMessage();\r
+\r
+ private Element fieldContainer = DOM.createDiv();\r
+\r
+ private Element footerContainer = DOM.createDiv();\r
+\r
+ private Container footer;\r
\r
public IForm() {\r
- super();\r
+ setElement(DOM.createFieldSet());\r
setStyleName(CLASSNAME);\r
+ DOM.appendChild(getElement(), legend);\r
+ DOM.appendChild(legend, caption);\r
+ DOM.setElementProperty(errorIndicatorElement, "className",\r
+ "i-errorindicator");\r
+ DOM.setStyleAttribute(errorIndicatorElement, "display", "none");\r
+ DOM.setInnerText(errorIndicatorElement, " "); // needed for IE\r
+ DOM.setElementProperty(desc, "className", "i-form-description");\r
+ DOM.appendChild(getElement(), desc);\r
+ DOM.appendChild(getElement(), fieldContainer);\r
+ errorMessage.setVisible(false);\r
+ errorMessage.setStyleName(CLASSNAME + "-errormessage");\r
+ DOM.appendChild(getElement(), errorMessage.getElement());\r
+ DOM.appendChild(getElement(), footerContainer);\r
}\r
\r
public void updateFromUIDL(UIDL uidl, ApplicationConnection client) {\r
- if (client.updateComponent(this, uidl, true)) {\r
+ if (client.updateComponent(this, uidl, false)) {\r
return;\r
}\r
\r
+ if (uidl.hasAttribute("caption")) {\r
+ DOM.setInnerText(caption, uidl.getStringAttribute("caption"));\r
+ } else {\r
+ DOM.setInnerText(caption, "");\r
+ }\r
+ if (uidl.hasAttribute("icon")) {\r
+ if (icon == null) {\r
+ icon = new Icon(client);\r
+ DOM.insertChild(legend, icon.getElement(), 0);\r
+ }\r
+ icon.setUri(uidl.getStringAttribute("icon"));\r
+ } else {\r
+ if (icon != null) {\r
+ DOM.removeChild(legend, icon.getElement());\r
+ }\r
+ }\r
+\r
+ if (uidl.hasAttribute("error")) {\r
+ final UIDL errorUidl = uidl.getErrors();\r
+ errorMessage.updateFromUIDL(errorUidl);\r
+ errorMessage.setVisible(true);\r
+\r
+ } else {\r
+ errorMessage.setVisible(false);\r
+ }\r
+\r
+ if (uidl.hasAttribute("description")) {\r
+ DOM.setInnerHTML(desc, uidl.getStringAttribute("description"));\r
+ } else {\r
+ DOM.setInnerHTML(desc, "");\r
+ }\r
+\r
+ iLayout();\r
+\r
final UIDL layoutUidl = uidl.getChildUIDL(0);\r
if (lo == null) {\r
lo = (Container) client.getPaintable(layoutUidl);\r
- setWidget((Widget) lo);\r
+ add((Widget) lo, fieldContainer);\r
}\r
lo.updateFromUIDL(layoutUidl, client);\r
+\r
+ if (uidl.getChildCount() > 1) {\r
+ // render footer\r
+ Container newFooter = (Container) client.getPaintable(uidl\r
+ .getChildUIDL(1));\r
+ if (footer == null) {\r
+ add((Widget) newFooter, footerContainer);\r
+ footer = newFooter;\r
+ } else if (newFooter != footer) {\r
+ remove((Widget) footer);\r
+ client.unregisterPaintable(footer);\r
+ add((Widget) newFooter, footerContainer);\r
+ }\r
+ footer = newFooter;\r
+ footer.updateFromUIDL(uidl.getChildUIDL(1), client);\r
+ } else {\r
+ if (footer != null) {\r
+ remove((Widget) footer);\r
+ client.unregisterPaintable(footer);\r
+ }\r
+ }\r
+ }\r
+\r
+ public void iLayout() {\r
+ // fix contained components container size as they may have relative\r
+ // widths\r
+ int width = DOM.getElementPropertyInt(desc, "offsetWidth");\r
+ DOM.setStyleAttribute(fieldContainer, "width", width + "px");\r
+ DOM.setStyleAttribute(footerContainer, "width", width + "px");\r
+ Util.runDescendentsLayout(this);\r
}\r
+\r
}\r
prepareCell(i, 1);
final UIDL childUidl = (UIDL) it.next();
final Paintable p = client.getPaintable(childUidl);
- Caption c = (Caption) componentToCaption.get(p);
- if (c == null) {
- c = new Caption(p, client);
- componentToCaption.put(p, c);
+ Caption caption = (Caption) componentToCaption.get(p);
+ if (caption == null) {
+ caption = new Caption(p, client);
+ componentToCaption.put(p, caption);
}
ErrorFlag error = (ErrorFlag) componentToError.get(p);
if (error == null) {
componentToError.put(p, error);
}
final Paintable oldComponent = (Paintable) getWidget(i, 1);
+ prepareCell(i, 2);
if (oldComponent == null) {
- setWidget(i, 1, (Widget) p);
+ setWidget(i, 2, (Widget) p);
} else if (oldComponent != p) {
client.unregisterPaintable(oldComponent);
- setWidget(i, 1, (Widget) p);
+ setWidget(i, 2, (Widget) p);
}
- setWidget(i, 0, c);
+ getCellFormatter().setStyleName(i, 0, "i-formlayout-captioncell");
+ setWidget(i, 0, caption);
- prepareCell(i, 2);
- getCellFormatter().setStyleName(i, 2, "i-formlayout-errorcell");
- setWidget(i, 2, error);
+ getCellFormatter().setStyleName(i, 1, "i-formlayout-errorcell");
+ setWidget(i, 1, error);
p.updateFromUIDL(childUidl, client);
import com.itmill.toolkit.data.Validator;
import com.itmill.toolkit.data.util.BeanItem;
import com.itmill.toolkit.data.util.MethodProperty;
+import com.itmill.toolkit.terminal.ThemeResource;
+import com.itmill.toolkit.ui.AbstractComponent;
import com.itmill.toolkit.ui.Button;
+import com.itmill.toolkit.ui.ExpandLayout;
import com.itmill.toolkit.ui.Form;
import com.itmill.toolkit.ui.OrderedLayout;
import com.itmill.toolkit.ui.Panel;
final Window mainWin = new Window("Test app for #736");
setMainWindow(mainWin);
+ mainWin.setTheme("example");
+
// Create form for editing address
final Form f = new Form();
f.setItemDataSource(new BeanItem(address, new String[] { "name",
"street", "zip", "city", "state", "country" }));
f.setCaption("Office address");
+ f.setIcon(new ThemeResource("../default/icons/16/document.png"));
+ f.setDescription("Jep jpe, this is form description.");
mainWin.addComponent(f);
// Select to use buffered mode for editing to enable commit and discard
f.setReadThrough(false);
Button commit = new Button("Commit", f, "commit");
Button discard = new Button("Discard", f, "discard");
- OrderedLayout ol = new OrderedLayout(
- OrderedLayout.ORIENTATION_HORIZONTAL);
+ ExpandLayout ol = new ExpandLayout(OrderedLayout.ORIENTATION_HORIZONTAL);
+ ol.setHeight("3em");
ol.addComponent(commit);
+ ol.setComponentAlignment(commit, ExpandLayout.ALIGNMENT_RIGHT,
+ ExpandLayout.ALIGNMENT_TOP);
ol.addComponent(discard);
- mainWin.addComponent(ol);
+ f.setFooter(ol);
// Add some validators for the form
f.getField("zip").addValidator(new IsInteger());
+ f.getField("zip").setDescription("Jepjep");
+ ((AbstractComponent) f.getField("zip")).setIcon(new ThemeResource(
+ "../default/icons/16/folder.png"));
f.getField("state").addValidator(new IsValidState());
f.getField("name").setRequired(true);
f.getField("street").setRequired(true);
}
};
+ private Layout formFooter;
+
/**
* Contructs a new form with default layout.
*
public void paintContent(PaintTarget target) throws PaintException {
super.paintContent(target);
layout.paint(target);
+ if (formFooter != null) {
+ formFooter.paint(target);
+ }
}
/*
throw new UnsupportedOperationException();
}
+ /**
+ * Returns a layout that is rendered below normal form contents. This area
+ * can be used for example to include buttons related to form contents.
+ *
+ * @return layout rendered below normal form contents.
+ */
+ public Layout getFooter() {
+ if (formFooter == null) {
+ formFooter = new OrderedLayout(OrderedLayout.ORIENTATION_HORIZONTAL);
+ setParent(formFooter);
+ }
+ return formFooter;
+ }
+
+ /**
+ * Sets the layout that is rendered below normal form contens.
+ *
+ * @param newFormFooter
+ * the new Layout
+ */
+ public void setFooter(Layout newFormFooter) {
+ if (formFooter != null) {
+ formFooter.setParent(null);
+ }
+ formFooter = newFormFooter;
+ formFooter.setParent(this);
+ }
+
}