- "String tag" : "aside",
- "String cls" : "right-side",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String tag" : "section",
- "String cls" : "content-header",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "xtype" : "Header",
- "$ xns" : "Roo.bootstrap",
- "String html" : "General Form Elements <small> Preview </small>"
- }
- ]
- },
- {
- "String tag" : "section",
- "String cls" : "content",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "xtype" : "Row",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "Number md" : 6,
- "xtype" : "Column",
- "$ xns" : "Roo.bootstrap",
- "Number sm" : 12,
- "items" : [
- {
- "String cls" : "box box-primary",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-header",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-title",
- "xtype" : "Header",
- "$ xns" : "Roo.bootstrap",
- "Number level" : 3,
- "String html" : "Quick Example"
- }
- ]
- },
- {
- "xtype" : "Form",
- "String labelAlign" : "top",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-body",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "xtype" : "Input",
- "string placeholder" : "Enter email",
- "String fieldLabel" : "Email Address",
- "$ xns" : "Roo.bootstrap",
- "String vtype" : "email"
- },
- {
- "xtype" : "Input",
- "string placeholder" : "Enter password",
- "String inputType" : "password",
- "String fieldLabel" : "Password",
- "$ xns" : "Roo.bootstrap"
- },
- {
- "xtype" : "Input",
- "string placeholder" : "Enter email",
- "String inputType" : "file",
- "String fieldLabel" : "File Input",
- "$ xns" : "Roo.bootstrap"
- },
- {
- "xtype" : "CheckBox",
- "String boxLabel" : "checkbox",
- "$ xns" : "Roo.bootstrap"
- },
- {
- "String weight" : "primary",
- "xtype" : "Button",
- "$ xns" : "Roo.bootstrap",
- "String html" : "Submit"
- }
- ]
- }
- ]
- }
- ]
- },
- {
- "String cls" : "box box-success",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-header",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-title",
- "xtype" : "Header",
- "$ xns" : "Roo.bootstrap",
- "Number level" : 3,
- "String html" : "Different Height"
- }
- ]
- },
- {
- "xtype" : "Form",
- "String labelAlign" : "top",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-body",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "xtype" : "Input",
- "string placeholder" : "size lg",
- "$ xns" : "Roo.bootstrap",
- "string size" : "lg"
- },
- {
- "xtype" : "Input",
- "string placeholder" : "size md",
- "$ xns" : "Roo.bootstrap",
- "string size" : "md"
- },
- {
- "xtype" : "Input",
- "string placeholder" : "size sm",
- "$ xns" : "Roo.bootstrap",
- "string size" : "sm"
- }
- ]
- }
- ]
- }
- ]
- },
- {
- "String cls" : "box box-danger",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-header",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-title",
- "xtype" : "Header",
- "$ xns" : "Roo.bootstrap",
- "Number level" : 3,
- "String html" : "Different Width"
- }
- ]
- },
- {
- "xtype" : "Form",
- "String labelAlign" : "top",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-body",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "xtype" : "Row",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "Number md" : 3,
- "xtype" : "Input",
- "string placeholder" : "md 3",
- "$ xns" : "Roo.bootstrap",
- "string size" : "md"
- },
- {
- "Number md" : 3,
- "xtype" : "Input",
- "string placeholder" : "md 4",
- "$ xns" : "Roo.bootstrap",
- "string size" : "md"
- },
- {
- "Number md" : 5,
- "xtype" : "Input",
- "string placeholder" : "md 3",
- "$ xns" : "Roo.bootstrap",
- "string size" : "md"
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- },
- {
- "String cls" : "box box-info",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-header",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-title",
- "xtype" : "Header",
- "$ xns" : "Roo.bootstrap",
- "Number level" : 3,
- "String html" : "Input Addon"
- }
- ]
- },
- {
- "xtype" : "Form",
- "String labelAlign" : "top",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-body",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "xtype" : "Input",
- "string placeholder" : "before : @",
- "$ xns" : "Roo.bootstrap",
- "string before" : "@",
- "string size" : "md"
- },
- {
- "xtype" : "Input",
- "string placeholder" : "after: .00",
- "$ xns" : "Roo.bootstrap",
- "string size" : "md",
- "string after" : 0
- },
- {
- "xtype" : "Input",
- "string placeholder" : "before $, after: .00",
- "$ xns" : "Roo.bootstrap",
- "string before" : "$",
- "string size" : "md",
- "string after" : 0
- },
- {
- "xtype" : "Header",
- "$ xns" : "Roo.bootstrap",
- "Number level" : 4,
- "String html" : "With Icons"
- },
- {
- "xtype" : "Input",
- "string placeholder" : "before : <i class="fa fa-envelope"></i>",
- "$ xns" : "Roo.bootstrap",
- "string before" : "<i class=\"fa fa-envelope\"></i>",
- "string size" : "md"
- },
- {
- "xtype" : "Input",
- "string placeholder" : "after : <i class="fa fa-after"></i>",
- "$ xns" : "Roo.bootstrap",
- "string size" : "md",
- "string after" : "<i class=\"fa fa-check\"></i>"
- },
- {
- "xtype" : "Input",
- "string placeholder" : "after : <i class="fa fa-ambulance"></i> before : <i class="fa fa-dollar"></i>",
- "$ xns" : "Roo.bootstrap",
- "string before" : "<i class=\"fa fa-dollar\"></i>",
- "string size" : "md",
- "string after" : "<i class=\"fa fa-ambulance\"></i>"
- },
- {
- "xtype" : "Header",
- "Number level" : 4,
- "$ xns" : "Roo.bootstrap",
- "String html" : "With checkbox and radio"
- },
- {
- "xtype" : "Row",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "Number md" : 6,
- "xtype" : "Input",
- "string placeholder" : "?",
- "$ xns" : "Roo.bootstrap",
- "string before" : "fixme",
- "string size" : "md"
- },
- {
- "Number md" : 6,
- "xtype" : "Input",
- "string placeholder" : "md 4",
- "$ xns" : "Roo.bootstrap",
- "string size" : "md"
- }
- ]
- },
- {
- "xtype" : "Header",
- "$ xns" : "Roo.bootstrap",
- "Number level" : 4,
- "String html" : "With buttons"
- },
- {
- "xtype" : "Input",
- "string placeholder" : "before : - an object... ",
- "$ xns" : "Roo.bootstrap",
- "string size" : "md",
- "items" : [
- {
- "listeners" : {
- "render" : "function (_self)\n{\n _this.httpButton = _self;\n}"
- },
- "String weight" : "primary",
- "xtype" : "Button",
- "$ xns" : "Roo.bootstrap",
- "String html" : "http://",
- "* prop" : "before",
- "items" : [
- {
- "xtype" : "Menu",
- "$ xns" : "Roo.bootstrap",
- "* prop" : "menu",
- "items" : [
- {
- "listeners" : {
- "click" : "function (e)\n{\n _this.httpButton.setText(\"http://\");\n}"
- },
- "xtype" : "MenuItem",
- "$ xns" : "Roo.bootstrap",
- "String html" : "http://"
- },
- {
- "listeners" : {
- "click" : "function (e)\n{\n _this.httpButton.setText(\"https://\");\n}"
- },
- "xtype" : "MenuItem",
- "$ xns" : "Roo.bootstrap",
- "String html" : "https://"
- }
- ]
- }
- ]
- }
- ]
- },
- {
- "xtype" : "Input",
- "string placeholder" : "after - a button",
- "$ xns" : "Roo.bootstrap",
- "string size" : "md",
- "items" : [
- {
- "String weight" : "success",
- "xtype" : "Button",
- "$ xns" : "Roo.bootstrap",
- "String html" : "Go",
- "* prop" : "after"
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- },
- {
- "Number md" : 6,
- "xtype" : "Column",
- "$ xns" : "Roo.bootstrap",
- "Number sm" : 12,
- "items" : [
- {
- "String cls" : "box box-warning",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-header",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-title",
- "xtype" : "Header",
- "$ xns" : "Roo.bootstrap",
- "Number level" : 3,
- "String html" : "General Elements"
- }
- ]
- },
- {
- "xtype" : "Form",
- "String labelAlign" : "top",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "String cls" : "box-body",
- "xtype" : "Container",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "xtype" : "Input",
- "string placeholder" : "Enter ...",
- "String fieldLabel" : "Text",
- "$ xns" : "Roo.bootstrap"
- },
- {
- "xtype" : "Input",
- "string placeholder" : "disabled = true",
- "Boolean disabled" : true,
- "String fieldLabel" : "Text",
- "$ xns" : "Roo.bootstrap"
- },
- {
- "xtype" : "TextArea",
- "$ xns" : "Roo.bootstrap",
- "String fieldLabel" : "Textarea"
- },
- {
- "xtype" : "TextArea",
- "string placeholder" : "disabled=true",
- "Boolean disabled" : true,
- "$ xns" : "Roo.bootstrap",
- "String fieldLabel" : "Textarea"
- },
- {
- "String cls" : "has-success",
- "xtype" : "Input",
- "string placeholder" : "cls = has-success",
- "String fieldLabel" : "Input with Success",
- "$ xns" : "Roo.bootstrap"
- },
- {
- "String cls" : "has-warning",
- "xtype" : "Input",
- "string placeholder" : "cls = has-warning",
- "String fieldLabel" : "Input with Warning",
- "$ xns" : "Roo.bootstrap"
- },
- {
- "String cls" : "has-error",
- "xtype" : "Input",
- "string placeholder" : "cls = has-error",
- "String fieldLabel" : "Input with Error",
- "$ xns" : "Roo.bootstrap"
- },
- {
- "xtype" : "CheckBox",
- "String boxLabel" : "Checkbox 1",
- "$ xns" : "Roo.bootstrap"
- },
- {
- "Boolean checked" : true,
- "String weight" : "primary",
- "xtype" : "CheckBox",
- "String boxLabel" : "Checkbox weight=primary",
- "$ xns" : "Roo.bootstrap"
- },
- {
- "xtype" : "CheckBox",
- "String boxLabel" : "Checkbox Disabled",
- "Boolean disabled" : true,
- "$ xns" : "Roo.bootstrap"
- },
- {
- "String name" : "radio",
- "xtype" : "Radio",
- "String boxLabel" : "Radio 1",
- "$ xns" : "Roo.bootstrap",
- "string value" : 1
- },
- {
- "String name" : "radio",
- "xtype" : "Radio",
- "String boxLabel" : "Radio (weight=danger)",
- "$ xns" : "Roo.bootstrap",
- "string value" : 2,
- "string weight" : "danger"
- },
- {
- "String name" : "radio",
- "xtype" : "Radio",
- "String boxLabel" : "Radio Disabled",
- "Boolean disabled" : true,
- "$ xns" : "Roo.bootstrap",
- "string value" : 3
- },
- {
- "xtype" : "ComboBox",
- "$ xns" : "Roo.bootstrap",
- "items" : [
- {
- "$ Array fields" : "[ 'item' ]",
- "$ Array data" : "[ [ 'option a', 'option b'] ]",
- "xtype" : "SimpleStore",
- "$ xns" : "Roo.data",
- "* prop" : "store"
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- }
- ]
- }
- ]