More form group components
parent
4a28e8f23a
commit
f4ee9d96b8
|
|
@ -0,0 +1,48 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form group with a number input">
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="value"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Value of the input field"
|
||||||
|
type="String" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<input aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
required="#{cc.attrs.required ? 'required' : null}"
|
||||||
|
type="color"
|
||||||
|
value="#{not empty cc.attrs.value ? cc.attrs.value : null}" />
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -0,0 +1,60 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form grouo with an HTML date input field">
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="max"
|
||||||
|
required="false"
|
||||||
|
shortDescription="The latest acceptable data"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="min"
|
||||||
|
required="false"
|
||||||
|
shortDescription="The earlist acceptable data"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="step"
|
||||||
|
required="false"
|
||||||
|
shortDescription="The stepping interval (in days)"
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="value"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Value of the input field"
|
||||||
|
type="String" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<input aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
max="#{cc.attrs.max}"
|
||||||
|
min="#{cc.attrs.min}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
step="#{cc.attrs.step}"
|
||||||
|
type="date"
|
||||||
|
value="#{cc.attrs.value}" />
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,82 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form group with a text input">
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="maxlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Maximum length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="minlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Minium length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="multiple"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Whether or not to allow multiple, comma-separated, e-mail addresses to be entered"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="pattern"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A RegEx pattern that the value entered into this field must match"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="placeholder"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A placeholder to show in the empty field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="size"
|
||||||
|
shortDescription="Length of the field. Can be overwritten using CSS."
|
||||||
|
required="false"
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="value"
|
||||||
|
default=""
|
||||||
|
required="false"
|
||||||
|
shortDescription="Value of the input field"
|
||||||
|
type="String" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<input aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
maxlength="#{(not empty cc.attrs.maxlength) ? cc.attrs.maxlength : null}"
|
||||||
|
minlength="#{(not empty cc.attrs.minlength) ? cc.attrs.minlength : null}"
|
||||||
|
multiple="#{cc.attrs.multiple ? 'multiple' : null}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
pattern="#{not empty cc.attrs.pattern ? cc.attrs.pattern : null}"
|
||||||
|
placeholder="#{not empty cc.attrs.placeholder ? cc.attrs.placeholder: null}"
|
||||||
|
required="#{cc.attrs.required ? 'required' : null}"
|
||||||
|
size="#{not empty cc.attrs.size ? cc.attrs.size : null}"
|
||||||
|
type="email"
|
||||||
|
value="#{not empty cc.attrs.value ? cc.attrs.value : ''}" />
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -0,0 +1,69 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form group with a number input">
|
||||||
|
<cc:attribute name="accept"
|
||||||
|
required="false"
|
||||||
|
shortDescription="One or more unique file type specifiers describing file types to allow"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="capture"
|
||||||
|
required="false"
|
||||||
|
shortDescription="What source to use for capturing image or video data"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="max"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Maximum allowed value."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="min"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Minimum allowed value."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="multiple"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A Boolean which, if present, indicates that the user may choose more than one file"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<input accept="#{not empty cc.attrs.accept ? cc.attrs.accept : null}"
|
||||||
|
aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
capture="#{not empty cc.attrs.capture ? cc.attrs.capture : null}"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
max="#{not empty cc.attrs.max ? cc.attrs.max : null}"
|
||||||
|
min="#{not empty cc.attrs.min ? cc.attrs.min : null}"
|
||||||
|
multiple="#{cc.attrs.multiple ? cc.attrs.multiple : null}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
required="#{cc.attrs.required ? 'required' : null}"
|
||||||
|
type="file" />
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -1,9 +1,6 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml"
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
xmlns:bootstrap="http://xmlns.jcp.org/jsf/composite/components/bootstrap"
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"
|
|
||||||
xmlns:cc="http://xmlns.jcp.org/jsf/composite"
|
|
||||||
xmlns:f="http://xmlns.jcp.org/jsf/core">
|
|
||||||
<cc:interface shortDescription="Component for a form group with a number input">
|
<cc:interface shortDescription="Component for a form group with a number input">
|
||||||
<cc:attribute name="help"
|
<cc:attribute name="help"
|
||||||
required="true"
|
required="true"
|
||||||
|
|
@ -48,17 +45,9 @@
|
||||||
type="String" />
|
type="String" />
|
||||||
</cc:interface>
|
</cc:interface>
|
||||||
<cc:implementation>
|
<cc:implementation>
|
||||||
<pre>
|
|
||||||
step = #{cc.attrs.step}
|
|
||||||
step = #{(not empty cc.attrs.step) ? cc.attrs.step : null}
|
|
||||||
step not empty? #{not empty cc.attrs.step}
|
|
||||||
</pre>
|
|
||||||
<div>
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
<!--<cc:renderFacet name="input" />-->
|
|
||||||
<input aria-describedby="#{cc.attrs.inputId}-help"
|
<input aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
data-step="#{cc.attrs.step}"
|
|
||||||
id="#{cc.attrs.inputId}"
|
id="#{cc.attrs.inputId}"
|
||||||
max="#{not empty cc.attrs.max ? cc.attrs.max : null}"
|
max="#{not empty cc.attrs.max ? cc.attrs.max : null}"
|
||||||
min="#{not empty cc.attrs.min ? cc.attrs.min : null}"
|
min="#{not empty cc.attrs.min ? cc.attrs.min : null}"
|
||||||
|
|
@ -73,8 +62,6 @@
|
||||||
#{cc.attrs.help}
|
#{cc.attrs.help}
|
||||||
</small>
|
</small>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
|
||||||
</cc:implementation>
|
</cc:implementation>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,75 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form group with a text input">
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="maxlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Maximum length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="minlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Minium length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="pattern"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A RegEx pattern that the value entered into this field must match"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="placeholder"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A placeholder to show in the empty field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="size"
|
||||||
|
shortDescription="Length of the field. Can be overwritten using CSS."
|
||||||
|
required="false"
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="value"
|
||||||
|
default=""
|
||||||
|
required="false"
|
||||||
|
shortDescription="Value of the input field"
|
||||||
|
type="String" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<input aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
maxlength="#{(not empty cc.attrs.maxlength) ? cc.attrs.maxlength : null}"
|
||||||
|
minlength="#{(not empty cc.attrs.minlength) ? cc.attrs.minlength : null}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
pattern="#{not empty cc.attrs.pattern ? cc.attrs.pattern : null}"
|
||||||
|
placeholder="#{not empty cc.attrs.placeholder ? cc.attrs.placeholder: null}"
|
||||||
|
required="#{cc.attrs.required ? 'required' : null}"
|
||||||
|
size="#{not empty cc.attrs.size ? cc.attrs.size : null}"
|
||||||
|
type="password"
|
||||||
|
value="#{not empty cc.attrs.value ? cc.attrs.value : ''}" />
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -0,0 +1,68 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form group with a number input">
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="max"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Maximum allowed value."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="min"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Minimum allowed value."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="placeholder"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A placeholder to show in the empty field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="step"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Stepping interval for the input"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="value"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Value of the input field"
|
||||||
|
type="String" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<input aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
class="custom-range"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
max="#{not empty cc.attrs.max ? cc.attrs.max : null}"
|
||||||
|
min="#{not empty cc.attrs.min ? cc.attrs.min : null}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
placeholder="#{not empty cc.attrs.placeholder ? cc.attrs.placeholder : null}"
|
||||||
|
required="#{cc.attrs.required ? 'required' : null}"
|
||||||
|
step="#{cc.attrs.step}"
|
||||||
|
type="range"
|
||||||
|
value="#{not empty cc.attrs.value ? cc.attrs.value : null}" />
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
@ -0,0 +1,74 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form group with a text input">
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="maxlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Maximum length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="minlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Minium length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="pattern"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A RegEx pattern that the value entered into this field must match"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="placeholder"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A placeholder to show in the empty field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="size"
|
||||||
|
shortDescription="Length of the field. Can be overwritten using CSS."
|
||||||
|
required="false"
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="value"
|
||||||
|
default=""
|
||||||
|
required="false"
|
||||||
|
shortDescription="Value of the input field"
|
||||||
|
type="String" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<input aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
maxlength="#{(not empty cc.attrs.maxlength) ? cc.attrs.maxlength : null}"
|
||||||
|
minlength="#{(not empty cc.attrs.minlength) ? cc.attrs.minlength : null}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
pattern="#{not empty cc.attrs.pattern ? cc.attrs.pattern : null}"
|
||||||
|
placeholder="#{not empty cc.attrs.placeholder ? cc.attrs.placeholder: null}"
|
||||||
|
required="#{cc.attrs.required ? 'required' : null}"
|
||||||
|
size="#{not empty cc.attrs.size ? cc.attrs.size : null}"
|
||||||
|
type="search"
|
||||||
|
value="#{not empty cc.attrs.value ? cc.attrs.value : ''}" />
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -0,0 +1,78 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form group with a text input">
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="maxlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Maximum length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="minlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Minium length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="pattern"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A RegEx pattern that the value entered into this field must match"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="placeholder"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A placeholder to show in the empty field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="size"
|
||||||
|
shortDescription="Length of the field. Can be overwritten using CSS."
|
||||||
|
required="false"
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="value"
|
||||||
|
default=""
|
||||||
|
required="false"
|
||||||
|
shortDescription="Value of the input field"
|
||||||
|
type="String" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<input aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
maxlength="#{(not empty cc.attrs.maxlength) ? cc.attrs.maxlength : null}"
|
||||||
|
minlength="#{(not empty cc.attrs.minlength) ? cc.attrs.minlength : null}"
|
||||||
|
multiple="#{cc.attrs.multiple ? 'multiple' : null}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
pattern="#{not empty cc.attrs.pattern ? cc.attrs.pattern : null}"
|
||||||
|
placeholder="#{not empty cc.attrs.placeholder ? cc.attrs.placeholder: null}"
|
||||||
|
required="#{cc.attrs.required ? 'required' : null}"
|
||||||
|
size="#{not empty cc.attrs.size ? cc.attrs.size : null}"
|
||||||
|
type="tel"
|
||||||
|
value="#{not empty cc.attrs.value ? cc.attrs.value : ''}" />
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -1,9 +1,6 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml"
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
xmlns:bootstrap="http://xmlns.jcp.org/jsf/composite/components/bootstrap"
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"
|
|
||||||
xmlns:cc="http://xmlns.jcp.org/jsf/composite"
|
|
||||||
xmlns:f="http://xmlns.jcp.org/jsf/core">
|
|
||||||
<cc:interface shortDescription="Component for a form group with a text input">
|
<cc:interface shortDescription="Component for a form group with a text input">
|
||||||
<cc:attribute name="help"
|
<cc:attribute name="help"
|
||||||
required="true"
|
required="true"
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,69 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form group with a number input">
|
||||||
|
<cc:attribute name="cols"
|
||||||
|
required="false"
|
||||||
|
shortDescription="The visible width of the text control, in average character widths. If it is specified, it must be a positive integer. If it is not specified, the default value is 20."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="maxlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Maximum length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="minlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Minium length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="rows"
|
||||||
|
required="false"
|
||||||
|
shortDescription="The number of visible text lines for the control."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="value"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Value of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="wrap"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Indicates how the control wraps text."
|
||||||
|
type="String" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<textarea aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
cols="#{not empty cc.attrs.cols ? cc.attrs.cols : null}"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
maxlength="#{not empty cc.attrs.maxlength ? cc.attrs.maxlength : null}"
|
||||||
|
minlength="#{not empty cc.attrs.minlength ? cc.attrs.maxlength : null}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
rows="#{not empty cc.attrs.rows ? cc.attrs.rows : null}"
|
||||||
|
wrap="#{not empty cc.attrs.wrap ? cc.attrs.wrap : null}">#{cc.attrs.value}</textarea>
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
@ -0,0 +1,61 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form grouo with an HTML date input field">
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="max"
|
||||||
|
required="false"
|
||||||
|
shortDescription="The latest time to accept."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="min"
|
||||||
|
required="false"
|
||||||
|
shortDescription="The earliest time to accept as a valid input"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="step"
|
||||||
|
required="false"
|
||||||
|
shortDescription="The stepping interval (in seconds)"
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="value"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Value of the input field"
|
||||||
|
type="String" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<input aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
max="#{cc.attrs.max}"
|
||||||
|
min="#{cc.attrs.min}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
step="#{cc.attrs.step}"
|
||||||
|
type="time"
|
||||||
|
value="#{cc.attrs.value}" />
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
@ -0,0 +1,83 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||||
|
xmlns:cc="http://xmlns.jcp.org/jsf/composite">
|
||||||
|
<cc:interface shortDescription="Component for a form group with a text input">
|
||||||
|
<cc:attribute name="help"
|
||||||
|
required="true"
|
||||||
|
shortDescription="A short description of the input field"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="inputId"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The ID of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="label"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The label of the input field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="maxlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Maximum length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="minlength"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Minium length of the text in this field."
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="multiple"
|
||||||
|
required="false"
|
||||||
|
shortDescription="Whether or not to allow multiple, comma-separated, e-mail addresses to be entered"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="name"
|
||||||
|
required="true"
|
||||||
|
shortDescription="The name of the input field. This is also the name which is used to send the value of the input to the server."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="pattern"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A RegEx pattern that the value entered into this field must match"
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute name="placeholder"
|
||||||
|
required="false"
|
||||||
|
shortDescription="A placeholder to show in the empty field."
|
||||||
|
type="String" />
|
||||||
|
<cc:attribute default="false"
|
||||||
|
name="required"
|
||||||
|
shortDescription="Is the field required?"
|
||||||
|
required="false"
|
||||||
|
type="boolean" />
|
||||||
|
<cc:attribute name="size"
|
||||||
|
shortDescription="Length of the field. Can be overwritten using CSS."
|
||||||
|
required="false"
|
||||||
|
type="int" />
|
||||||
|
<cc:attribute name="value"
|
||||||
|
default=""
|
||||||
|
required="false"
|
||||||
|
shortDescription="Value of the input field"
|
||||||
|
type="String" />
|
||||||
|
</cc:interface>
|
||||||
|
<cc:implementation>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="#{cc.attrs.inputId}">${cc.attrs.label}</label>
|
||||||
|
<input aria-describedby="#{cc.attrs.inputId}-help"
|
||||||
|
id="#{cc.attrs.inputId}"
|
||||||
|
maxlength="#{(not empty cc.attrs.maxlength) ? cc.attrs.maxlength : null}"
|
||||||
|
minlength="#{(not empty cc.attrs.minlength) ? cc.attrs.minlength : null}"
|
||||||
|
multiple="#{cc.attrs.multiple ? 'multiple' : null}"
|
||||||
|
name="#{cc.attrs.name}"
|
||||||
|
pattern="#{not empty cc.attrs.pattern ? cc.attrs.pattern : null}"
|
||||||
|
placeholder="#{not empty cc.attrs.placeholder ? cc.attrs.placeholder: null}"
|
||||||
|
required="#{cc.attrs.required ? 'required' : null}"
|
||||||
|
size="#{not empty cc.attrs.size ? cc.attrs.size : null}"
|
||||||
|
type="url"
|
||||||
|
value="#{not empty cc.attrs.value ? cc.attrs.value : ''}" />
|
||||||
|
<small class="form-text text-muted"
|
||||||
|
id="#{cc.attrs.inputId}-help">
|
||||||
|
#{cc.attrs.help}
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
</cc:implementation>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -31,6 +31,70 @@
|
||||||
name="price"
|
name="price"
|
||||||
step="0.01"
|
step="0.01"
|
||||||
value="10.0" />
|
value="10.0" />
|
||||||
|
<bootstrap:formGroupDate help="Test of date form group"
|
||||||
|
inputId="dateTest"
|
||||||
|
label="Date Test"
|
||||||
|
max="2020-11-30"
|
||||||
|
min="2020-11-02"
|
||||||
|
name="dateTest"
|
||||||
|
step="7"
|
||||||
|
value="2020-11-02" />
|
||||||
|
<bootstrap:formGroupTime help="Test of date form group"
|
||||||
|
inputId="dateTest"
|
||||||
|
label="Date Test"
|
||||||
|
max="08:00"
|
||||||
|
min="18:00"
|
||||||
|
name="dateTest"
|
||||||
|
step="900"
|
||||||
|
value="08:00" />
|
||||||
|
<bootstrap:formGroupSearch help="search test"
|
||||||
|
inputId="searchtest"
|
||||||
|
label="Search Test"
|
||||||
|
name="searchtest"
|
||||||
|
placeholder="Search" />
|
||||||
|
<bootstrap:formGroupPassword help="password test"
|
||||||
|
inputId="passwordtest"
|
||||||
|
label="Password Test"
|
||||||
|
name="passwordtest"
|
||||||
|
placeholder="Password" />
|
||||||
|
<bootstrap:formGroupEmail help="email test"
|
||||||
|
inputId="emailtest"
|
||||||
|
label="Email Test"
|
||||||
|
name="emailtest"
|
||||||
|
placeholder="foo@example.com" />
|
||||||
|
<bootstrap:formGroupTel help="Tel test"
|
||||||
|
inputId="teltest"
|
||||||
|
label="Tel Test"
|
||||||
|
name="teltest"
|
||||||
|
placeholder="00000 00000" />
|
||||||
|
<bootstrap:formGroupFile help="File test"
|
||||||
|
inputId="filetest"
|
||||||
|
label="File Test"
|
||||||
|
name="filetest" />
|
||||||
|
<bootstrap:formGroupUrl help="URL test"
|
||||||
|
inputId="urltest"
|
||||||
|
label="URL Test"
|
||||||
|
name="urltest"
|
||||||
|
placeholder="https://www.example.org/foo/bar" />
|
||||||
|
<bootstrap:formGroupColor help="Color Test"
|
||||||
|
inputId="colortest"
|
||||||
|
label="Color"
|
||||||
|
name="color" />
|
||||||
|
<bootstrap:formGroupRange help="A range"
|
||||||
|
inputId="rangetest"
|
||||||
|
label="Range"
|
||||||
|
max="20"
|
||||||
|
min="5"
|
||||||
|
name="rangetest"
|
||||||
|
step="0.1"
|
||||||
|
value="10.0" />
|
||||||
|
<bootstrap:formGroupTextarea cols="80"
|
||||||
|
help="Textarea Test"
|
||||||
|
label="Textarea"
|
||||||
|
inputId="textareatest"
|
||||||
|
name="textareatest"
|
||||||
|
rows="10" />
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
<p>ToDo</p>
|
<p>ToDo</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue