Advanced Examples

Inline Form Layout


<s:form theme="simple" cssClass="well form-search">
    <s:textfield
            placeholder="Login"
            name="login"
            tooltip="Enter your Name here"/>

    <s:password
            placeholder="Password"
            name="password"/>

    <s:submit cssClass="btn btn-primary"/>
</s:form>
                    

Elements with Help Text, prepended text and appended text or prepended icon and appended icon

This Textfield has an Help Text.
@
$

<s:form theme="bootstrap" cssClass="well form-vertical">
    <s:textfield
            label="Name"
            name="name"
            helpText="This Textfield has an Help Text."
            tooltip="Enter your Name here"/>

    <s:textfield
            label="Textfield with prepended text"
            inputPrepend="@"
            name="prepend"/>

    <s:textfield
            label="Textfield with appended text"
            inputAppend="$"
            name="append"/>

    <s:submit cssClass="btn btn-primary"/>
    <s:submit cssClass="btn btn-danger"/>
</s:form>
                    

A Bootstrap Form with jQuery AJAX Form

AJAX Echo Form

<s:form action="echo" theme="bootstrap" cssClass="well form-vertical" label="AJAX Echo Form">
    <s:textfield
            label="Enter your Name"
            name="echo"
            tooltip="Enter your Name here"/>

    <sj:submit targets="result" effect="highlight" cssClass="btn-success"/>
</s:form>
<div id="result"></div>